Как,ще се променят кодовете от урока?

plamen_003

Registered
Как,ще се променят кодовете от този урок:

http://web-tourist.net/login/login/view.php?st=2386

За да когато сложа менюто да избера в коя част на сайта да стои.

Ето кода:



Код:
<html> 
<head><title>Menu</title> 
<style type="text/css"> 
.menu { 
width:120px; /*задаваме широчина*/ 
height:60px; /*задаваме височина*/ 
padding:3px 40px; /*задаваме вътрешните отстъпи*/ 
color:#000; /*цвят на текста в нормално състояние*/ 
font-weight:bold; /*форматиране на текста,в случая текста ще бъде удебелен*/ 
letter-spacing:0.5px; /*разстояние между буквите*/ 
background:#333 url('menu.jpg') 0 0px no-repeat; /*задаваме фон на бутона в нормано състояние*/ 
border:1px solid #000; /*задаваме рамка на бутона*/ 
text-decoration:none; /* задаваме да няма подчертаване на линковете*/ 
} 

.menu:hover { 
color:#FFF; /*цвят на текста когато сме посочили бутона*/ 
background-position: 0 -32px; /*посочваме стойностите откъде докъде да използва картинката за фон*/ 
} 

</style> 
</head> 

<body> 
<a href="#" class="menu">Link</a><br><br> 
<a href="#" class="menu">Link</a><br><br> 
<a href="#" class="menu">Link</a><br><br> 
<a href="#" class="menu">Link</a><br><br> 
<a href="#" class="menu">Link</a><br><br> 
<a href="#" class="menu">Link</a> 
</body></html>
 
Код:
	 <html> 
<head><title>Menu</title> 
<style type="text/css"> 
.menu { 
width:120px; /*задаваме широчина*/ 
height:60px; /*задаваме височина*/ 
padding:3px 40px; /*задаваме вътрешните отстъпи*/ 
color:#000; /*цвят на текста в нормално състояние*/ 
font-weight:bold; /*форматиране на текста,в случая текста ще бъде удебелен*/ 
letter-spacing:0.5px; /*разстояние между буквите*/ 
background:#333 url('menu.jpg') 0 0px no-repeat; /*задаваме фон на бутона в нормано състояние*/ 
border:1px solid #000; /*задаваме рамка на бутона*/ 
text-decoration:none; /* задаваме да няма подчертаване на линковете*/ 
} 

.menu:hover { 
color:#FFF; /*цвят на текста когато сме посочили бутона*/ 
background-position: 0 -32px; /*посочваме стойностите откъде докъде да използва картинката за фон*/ 
} 

</style> 
</head> 


<body>
<table align="[color=red]right[/color]">
<tr>
<td> 
<a href="#" class="menu">Link</a><br><br> 
<a href="#" class="menu">Link</a><br><br> 
<a href="#" class="menu">Link</a><br><br> 
<a href="#" class="menu">Link</a><br><br> 
<a href="#" class="menu">Link</a><br><br> 
<a href="#" class="menu">Link</a>
</td>
</tr>
</table> 
</body></html>


Това в червеното казва каде да се намира
right - да се намира в дясно
left - да се намира в лява
center - да се намира в центъра
 
Код:
<html> 
<head><title>Menu</title> 
<style type="text/css"> 
.menu { 
width:120px; /*задаваме широчина*/ 
height:60px; /*задаваме височина*/ 
padding:3px 40px; /*задаваме вътрешните отстъпи*/ 
color:#000; /*цвят на текста в нормално състояние*/ 
font-weight:bold; /*форматиране на текста,в случая текста ще бъде удебелен*/ 
letter-spacing:0.5px; /*разстояние между буквите*/ 
background:#333 url('menu.jpg') 0 0px no-repeat; /*задаваме фон на бутона в нормано състояние*/
[color=red]margin-left: 50px;
margin-top: 50px; [/color]
border:1px solid #000; /*задаваме рамка на бутона*/ 
text-decoration:none; /* задаваме да няма подчертаване на линковете*/ 
} 

.menu:hover { 
color:#FFF; /*цвят на текста когато сме посочили бутона*/ 
background-position: 0 -32px; /*посочваме стойностите откъде докъде да използва картинката за фон*/ 
} 

</style> 
</head> 

<body> 
<a href="#" class="menu">Link</a><br><br> 
<a href="#" class="menu">Link</a><br><br> 
<a href="#" class="menu">Link</a><br><br> 
<a href="#" class="menu">Link</a><br><br> 
<a href="#" class="menu">Link</a><br><br> 
<a href="#" class="menu">Link</a> 
</body></html>


Променяш пикселите докато си го наместиш
другa опциa на margin e
margin-right
 
<html>
<head><title>Menu</title>
<style type="text/css">
.menu {
width:120px; /*задаваме широчина*/
height:60px; /*задаваме височина*/
padding:3px 40px; /*задаваме вътрешните отстъпи*/
color:#000; /*цвят на текста в нормално състояние*/
font-weight:bold; /*форматиране на текста,в случая текста ще бъде удебелен*/
letter-spacing:0.5px; /*разстояние между буквите*/
background:#333 url('menu.jpg') 0 0px no-repeat; /*задаваме фон на бутона в нормано състояние*/
margin-left: 50px;
margin-top: 50px;

border:1px solid #000; /*задаваме рамка на бутона*/
text-decoration:none; /* задаваме да няма подчертаване на линковете*/
}

.menu:hover {
color:#FFF; /*цвят на текста когато сме посочили бутона*/
background-position: 0 -32px; /*посочваме стойностите откъде докъде да използва картинката за фон*/
}

</style>
</head>

<body>
<a href="#" class="menu">Link</a><br><br>
<a href="#" class="menu">Link</a><br><br>
<a href="#" class="menu">Link</a><br><br>
<a href="#" class="menu">Link</a><br><br>
<a href="#" class="menu">Link</a><br><br>
<a href="#" class="menu">Link</a>
</body></html>



оцветеното в червено му промени пикселите докато го наместиш променяй
 
Става мерси!И ако ми кажеш как,ще стане когато бутона е с повече текст да не ставва това http://img706.imageshack.us/img706/3575/69638722.png , да няма сиво след фона...
 

Back
Горе