Tutorial Flat Menu Css / Font Awesome

Filip Cristian · January 21, 2015

Meniu flat folosind css, legaturi si awesome font.

CSS:

#flatmenu {
    background: #3498db;
    width: 100%;
    height: 60px;
    line-height: 60px;
}

#flatmenu a {
    padding: 0px 10px;
    color: #fff;
    font-size: 11px;
    text-transform: uppercase;
    font-family: sans-serif;
    text-decoration: none;
    display: table-cell;
}

#flatmenu a:hover {
    background: #2980b9;
}

.first {
    padding: 0px 15px;
    background: #2980b9;
    font-size: 13px;
}

HTML:

<html>
   <head>
       <title>FLAT MENU</title>
       <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">
   </head>

<body>
<div id="flatmenu">
    <a href="#" class="first"><i class="fa fa-home first"></i></a>
    <a href="#">Pagina 1</a>
    <a href="#">Pagina 2</a>
    <a href="#">Pagina 3</a>
    <a href="#">Pagina 4</a>
    <a href="#">Pagina 5</a>
</div>
</body>

</html>

Preview:

*Meniul nu este luat de pe internet, este facut de mine. Sper sa va fie de folos.

Sign In

Tutorial Flat Menu Css / Font Awesome

Recommended Posts

Filip Cristian

Please sign in to comment

Recently Browsing 0 members

Activity

Browse

Important Information