ЭЙ, Стой!!! Горизонтальное меню на CSS с графикой / Скачать меню для css

Автор: | 12.01.2020

на главную nocrisise.ruназ к меню на CSS

скачать сборник меню для CSS – красивого и готового к работе

Для любителей CSS, я покажу пример как сделать простое горизонтальное меню, только используя CSS и графики. Хоть это горизонтальное меню простое в написании, но зато красивое, лёгкая для загрузки и смотрится шикарно.

Горизонтальное меню на CSS

просмотр горизонтального меню (пример) просмотр горизонтального меню (пример)

скачать исходник меню для CSSскачать исходник  меню для CSS

Скопируйте и вставьте

<html>
<head>

<style type=”text/css”>

body {font: 11px Arial, Helvetica, sans-serif;
}

#menu {font: 11px Arial, Helvetica, sans-serif;
background-image:url(‘/wp-content/uploads/images/bc_bg.png’);
background-repeat:repeat-x;
height:30px;
line-height:30px;
color:#9b9b9b;
border:solid 1px #cacaca;
width:100%;
overflow:hidden;
margin:0px;
padding:0px;
}

#menu li {list-style-type:none;
float:left;
padding-left:10px;
}

#menu a {height:30px;
display:block;
background-image:url(‘/wp-content/uploads/
images/bc_separator.png‘);
background-repeat:no-repeat;
background-position:right;
padding-right: 15px;
text-decoration: none;
color:#454545;
}

.home {border:none;
margin: 8px 0px;
}

#menu a:hover{color: gray;
}

</style>

</head>


<body>

<div id=”menu”>
<ul>
<li><a href=”#”><span>
Домой</span></a></li>
<li><a href=”#”><span>
о нас</span></a></li>
<li><a href=”#”><span>
работы</span></a></li>
<li><a href=”#”><span>
партнёры</span></a></li>
<li><a href=”#”><span>
Контакты</span></a></li>
</ul>

</div>

</body>
</html>

bc_separator.png – картинка прилагается к исходнику.чайник, HTML ДЛЯ ЧАЙНИКОВ

По теме:

CSS

меню для сайтов ucoz

 

 

 

 

 

Горизонтальное меню на CSS с графикой

Читайте также:  ЭЙ, Стой!!! Красивые меню для сайта ucoz- вертикальное меню для сайта ucoz

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *