Пятница, 2024-11-01, 14:27
Приветствую Вас Гость | RSS
[ Новые сообщения · Участники · Правила форума · Поиск · RSS ]
  • Страница 1 из 1
  • 1
Симпатичное меню
Ma$haДата: Суббота, 2009-05-23, 23:28 | Сообщение # 1
Генералиссимус
Группа: Пользователи
Сообщений: 261
« 9 »
Статус:

Код CSS

Code
img{border: 0pt;}  

#vista_toolbar {  
float:left;  
font:normal 12px 'Trebuchet MS','Arial';  
margin:0;  
padding:0;  
}  
#vista_toolbar ul {  
background-image:url(back.gif);  
background-repeat:repeat-x;  
float:left;  
line-height:32px;  
list-style:none;  
margin:0;  
padding:0 10px 0 10px;  
width:500px;  
}  
#vista_toolbar li {  
display:inline;  
padding:0;  
}  
#vista_toolbar a {  
color:#FFF;  
float:left;  
padding:0 3px 0 3px;  
text-decoration:none;  
}  
#vista_toolbar a span {  
display:block;  
float:none;  
padding:0 10px 0 7px;  
}  
#vista_toolbar a span img {  
border:none;  
margin:8px 4px 0 0;  
}  
#vista_toolbar a:hover{  
background: url(left.png) no-repeat left center;  
}  
#vista_toolbar a:hover span {  
background:url(right.png) no-repeat right center;  
}  
#vista_toolbar a.right {  
float:right;  
}

HTML

Code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">  
<head>  
<title>Vista toolbar с помощью CSS</title>  
<link href="style.css" media="all" rel="stylesheet" type="text/css" />  
</head>  
<body>  
<div>  
<h1>Vista toolbar с помощью CSS</h1>  
</div>  
<div id="vista_toolbar">  
<ul>  
<li><a href="#"><span><img align="left" src="add.gif" alt="Добавить" />Добавить</span></a></li>  
<li><a href="#"><span><img align="left" src="mail.gif" alt="Почта" />Почта</span></a></li>  
<li><a href="#"><span><img align="left" src="chart.gif" alt="Статистика" />Статистика</span></a></li>  
<li><a href="#"><span><img align="left" src="mona.gif" alt="Фотогалерея" />Фотогалерея</span></a></li>  
<li><a class="right" href="#"><span><img align="left" src="sos.gif" alt="Помощь" />Помощь</span></a></li>  
</ul>  
</div>  
</body>  
</html>
  • Страница 1 из 1
  • 1
Поиск:

Что такое любовь? Первое свидание, первый поцелуй...фан сайт Lady Gaga скачать бесплатно IGO карты для навигаторов