Саздавате два файла един HTML и един CSS едитваме хтмл документа и пишем в него
// Има 2 начина за саздаването на навбар но и двата правят едно и съящо нещо !! сега ще използваме по-простия начин !!
Коментарите в хтмл се слагат в ъглови скопи пример <!-- Tova e comentar -->
index.html
Code: Select all
<!DOCTYPE html> <!-- Девинираме, че съдържанието в файла е HTML5 -->
<html> <!-- отварящ таг оказваш началото на хтмл документа -->
<head> <!-- Това е главната част "главата на документа" моше да съдържа хипер връски, мета дани, инфо, и полезна информация за самия документ -->
<meta charset="utf-8" /> <!-- Това е мета таг разпознаващ изиците не може без него -->
<meta lang="en" /> <!-- Това също е мета таг но той дава информация на какъв език е написън кода -->
<link rel="stylesheet" type="text/css" href="style.css" /> <!-- Това инклудва цсс файла в хтмл документа -->
<!-- Толкова за хеад часта тези дани са ни достатачни за да си направим готиния навбар :д -->
</head> <!-- Край на хеад тага -->
<body> <!-- Това е отварящ таг на бодито тоест тялото на документа -->
<div class="navbar">
<!-- Start Links -->
<a href="#">начало</a>
<a href="#">начало</a>
<a href="#">начало</a>
<a href="#">начало</a>
<a href="#">начало</a>
<!-- End Links -->
</div> <!-- Navbar -->
</body> <!-- Това е затварящия таг на бодито -->
</html <!-- End html -->
![Smile :)](./images/smilies/smile.gif)
Преминаваме към цсс файла:
В цсс /* Tova e coment */
style.css
![Very Happy :D](./images/smilies/biggrin.gif)
Code: Select all
* { padding: 0px; margin : 0px; } /* Премахва отстъпа от хтмл документа демек ня да е малко на ляво или на дясно */
а { text-decoration: none } /* Премахва декоративният бордер */
li { list-style-type: none } /* Премахва декоративните приставки на ли тага */
.navbar {
width: 1000px; /* Дължина 1000px /*
height 35px; /* Щирина 30px */
background-color: #333; /* Черен Фон */
border-top: 3px solid dodgerblue; /* Бордер от горната страна на навбара 3пх в син цвят */
border-bottom: 3px solid dodgerblue; */ Същото само, че от долу */
margin: auto; /* Центрира навбара */
.navbar a {
display: block; /* Придаваме на а тага да е блоков елемент */
font-weight: bold; /* Текста да е одебелен */
font-size: 11px; /* Текста ще е 11 пиксела */
text-transform: uppercase; */ Не зависимо дали сме го написали с малки или големи букви то ще се показва с големи */
color: dodgerblue; /* Цвета на текста */
padding-left: 10px; /* текста ще се одалечи с 10 пиксела от ляво */
padding-right: 10px; /* текста ще се одалечи с 10 пиксела от дясно */
line-height: 35px; /* Текста ще е по средата на навбара хоризонтално */
float: left; /* Ще дръпне текста на ляво с цел да е хоризонтално навбарче */
font-family: Tahoma;
Ето и кодовете но не знам да ли е от мен грешката или от приятеля дето съм ги копнал. Има ли някой дето разбира от дизайн за навбар, да ли някой ще ми помогне за тази ситуация?