fiksna navigacijska vrstica, fixed top menu

Fiksna navigacijska vrstica

Fiksna navigacijska vrstica (ang. Fixed navigation bar) je element spletne strani, ki ostane na vrhu okna brskalnika, ko se uporabnik pomika po strani. Takšna vrstica je uporabna, ker omogoča uporabnikom hiter dostop do navigacije ne glede na to, kje se nahajajo na strani. Pogosto vsebuje povezave do ključnih delov spletne strani, kot so domača stran, o nas, storitve, kontakt in podobno.

<!DOCTYPE html>
<html lang="sl">
<head>
    <meta charset="UTF-8">
    <title>fiksna navigacijska vrstica, fixed top menu</title>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">

@media screen and (max-width: 840px) {
            .searchBox {
                float: none;
                width: 100%;
            }
            .searchBox input[type=text] {
                font-size: 24px;
                padding-top: 10px;
            }
            .container h1 {
                margin-top: 80px;
            }
        }
        @media screen and (max-width: 664px) {
            .container h1 {
                margin-top: 120px;
            }
        }

@media screen and (max-width: 342px){
            .container h1 {
                margin-top: 160px;
            }
        }

@media screen and (max-width: 232px){
            .container h1 {
                margin-top: 250px;
            }
        }

@media screen and (max-width: 224px){
            .container h1 {
                margin-top: 300px;
            }
        }
    </style>
</head>
<body>
<div class="navbar">
    <a href="#">DOMOV</a>
    <a href="#">DEMO 01</a>
    <a href="#">DEMO 02</a>
    <a href="#">DEMO 03</a>
    <a href="#">DEMO 04</a>
    <a href="#">DEMO 05</a>

<div class="container">
    <h1>Dobrodošli v CSS vadnico</h1>
</div>
</body>
</html>