как да съчетая две менюта хоризонтално и вертикално на една страница
Follow along with the video below to see how to install our site as a web app on your home screen.
Бележка: This feature may not be available in some browsers.
<style>
ul li{
display:inline;
text-align:center;
padding-left:10px;
float:left;
}
ul li a{
padding-top:10px;/*Добавяме 10рх падинг понеже синята лента ми е с такава височина*/
display:block;/*задава блокова структура на линковете*/
width:100px;/*Ширина на бутона в случая се съобразявам с картинката която ползавм за бекграунд*/
height:32px;/*Височина на бутона отново се съобразявамс картинката която ползвам за бекграунд тя е 42рх но съм извадил 10рх понеже съм задал и 10рх падинг*/
background:url(http://kick-off-fm.qhoster.net/projects/wtestate/images/menubg.jpg) no-repeat center;/* картинката която се бекграунд*/
color:#999;/*Цвят на буквите*/
text-decoration:none;/*В случая това премахва подчертаването на линковете*/
font-size:16px;/*Големина на буквите*/
font-weight:bold;
}
1ul li a:hover{
color:#fff;
background:url(http://kick-off-fm.qhoster.net/projects/wtestate/images/mutehover.jpg) no-repeat center;
}
#nav
{
background-color: #000;
width: 133px;
}
#nav a
{
background-color: #ED3E3E;
border-top: 1px solid #FC7171;
border-left: 2px solid #71CE4D;
border: 1px solid black;
height: 17px;
width: 110px;
font-family: verdana;
font-size: 11px;
color: white;
text-decoration: none;
padding-left: 20px;
padding-top: 2px;
display: block;
}
#nav a:hover
{
text-decoration: none;
background-color: #71CE4D;
border-top: #A2EA86;
border-bottom: 1px solid black;
}
#nav a:active {
background-color: #52BCF7;
text-decoration: none;
border-top: #A2DBFC;
border-left: 2px solid #52BCF7;
</style>
<table>
<tr>
<td width=100% height=10%>
<ul>
<li><a href="#">Купува</a></li>
<li><a href="#">Продава</a></li>
<li><a href="#">Под наем</a></li>
<li><a href="#">Контакти</a></li>
</ul>
</td>
</tr>
<tr>
<td width=30% height=90% align=left>
<div id="nav">
<a href="">Италия</a>
<a href="">Италия</a>
<a href="">Италия</a>
<a href="">Италия</a>
<a href="">Италия</a>
<a href="">Италия</a>
</div>
</td>
</tr>
</table>