Хочу быть web-дизайнером. Урок 1.
Основы
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.
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.