lapressa

Основы
HTML, как и любой другой язык высокоуровнего программирования, имеет строгие логические правила, опираясь на которые и строится ваш интернет ресурс. В данном уроке мы их рассмотрим.

Скелет
За этим названием скрывается обязательная последовательность тэгов, которые и образуют красивый внешний вид вашего сайта.

Выглядит он так







Вот такой непонятный и невзрачный, на превый взгляд кусок кода и является началом над долгой и увлекательной работой по созданию любого web-шаблона.

Где: ,,, -основные тэги, которые никоим случаем нельзя исключать.

,, - обозначают закрытие тэга, и тем самым, определяют границу каждой рабочей области из перечисленных .

шаблон (внешний вид сайта) следует сохранять в .html формате. Например, создаете текстовой файл "file.txt" и переименовываете его в нужное вам имя, меня расширение файла на .html

Если это ключевая страница вашего, простого шаблона, то назовите ее Index.html именно с такойго имени и расширения файла начинается индескация вашего сайтика на хостинге

После чего открываете данный файл с помощью блакнота и вставляете туда наш скелет.

Теперь можно начать делать наш простенький сайтик.

DIV
... - С этого момента это ваш основной друг, брат и папа. Именно в этих тегах и содержиться информация вашего сайтика.

данный тэг (...) необходимо вставлять в внутрь тэга . Пример:






* Привет я твой первый текст *




Теперь воспользуемся великим CSS для передачи позиции дива, необходимых нам параметров для визуального отображения.








* Привет я твой первый текст *




где ... - область для присваивания значения для
.class 'ов и их параметров.




.text {
position:fixed;
width:20%;
height:20%;
top:40%;
left:40%;
}




* Привет я твой первый текст *




Для более быстрого восприятия css советую вам использовать Adobe Dreamweaver CS6.

Сохраняем наш index.html и перетаскиваем в окно браузера. Смотрим что получилось.

В дальнейших уроках будим учиться вставлять картинки, изучать css и самые оптимальные значения для использования. А так же, будим познавать прекрасный мир анимации JQuery.