Перейти к содержанию
Авторизация  

Основной принцип верстки.


Описание

Основной принцип кроссбраузерной верстки.

Верстка существует 2 видов. Табличная (с использованием <table><tr><td></td></tr></table>), а так-же Кроссбраузерная (DIV верстка).

Табличная - это первая верстка, которая существует уже довольно давно. А вот кроссбраузерная вышла довольно не давно. Всего несколько лет назад.

О табличной говорить не буду.

 

Основной принцип кросс. верстки заключается в том, что у вас существует css файл, куда вносятся все изменения блока и вызываются в вашем html,php,tpl файле с помощью команды <div>

К примеру:

Вы хотите поместить картинку.

CSS.

#kartinka{

background: url(../images/myimg.png); вызываем картинку

width: 100px; ширина

height:100px; высота

position:absolute; каким способом позиционируем картинку

margin-left: 125px; отступ от левого края на ...

margin-top:100px; отступ от верхнего края на ...

}

 

При указании переменной kartinka, я указал "#" вызывается он с помощью <div id=".....">, если указать ".", то вызываться будет с помощью <div class="....">

Основное различие заключается в том, что через точку(.) вы можете вызывать вашу переменную из каскадного стиля(css) неограниченое количество раз, а собственно через решетку (#) только один раз!

 

HTML.

<html>

<head>

<title>Ваш титул сайта</title>

<link rel="stylesheet" type="text/css" href="css/mysite.css"> - Подключаете css файлик

 

</head>

<body>

<div id="kartinka"></div> - Вызываем вашу картинку из css

</body>

</html>

 

Трудного ничего нет. Главное уметь правильно пользоваться самим css и писать в нем код. Увы, но коды нужно учить. И имеются некоторые тонкости в css, но с ними уже будете знакомиться, когда научитесь самой верстке.

 

Спасибо за внимание. И удачного вам обучения.



Рекомендуемые комментарии

Комментариев нет

×
×
  • Создать...