Делаем сайт на div-ах (Рейтинг: +2)
Для тех, кто уже знает что такое дивный дизайн начинаем 1-й урок по созданию сайта в формате div.
Поскольку дивный дизайн состоит не из таблиц, как табличный дизайн, а из слоёв (блоков), то и конструкция всего нашего будущего сайта будет состоять из слоёв:
<div></div>
Тег <div> является парным, поэтому каждый блок должен закрываться, например:
<div>Первый блок</div>
Хорошо, с этим понятно, теперь сделаем HTML-страничку, а кто ещё не умеет этого делать прошу начать изучать азы создания сайтов.
Создайте файл index.html и напечатайте там следующий код:
Откройте страничку в браузере.
По-умолчанию созданный нами слой прозрачный, поэтому мы видим только слова, которые вписали внутри слоя.
Теперь создадим ещё два слоя.
Добавил: Удаленный
17.08.2010 / 04:35Поскольку дивный дизайн состоит не из таблиц, как табличный дизайн, а из слоёв (блоков), то и конструкция всего нашего будущего сайта будет состоять из слоёв:
<div></div>
Тег <div> является парным, поэтому каждый блок должен закрываться, например:
<div>Первый блок</div>
Хорошо, с этим понятно, теперь сделаем HTML-страничку, а кто ещё не умеет этого делать прошу начать изучать азы создания сайтов.
Создайте файл index.html и напечатайте там следующий код:
<html> <head> <title>Дивный дизайн</title> <meta http-equiv="Content-Type" content="text/html; charset="windows-1251"> </head> <body> <div>Первый блок</div> </body> </html>Это стандартный код хтмл-страницы? в который мы вставили первый слой, он выделен красным цветом.
Откройте страничку в браузере.
По-умолчанию созданный нами слой прозрачный, поэтому мы видим только слова, которые вписали внутри слоя.
Теперь создадим ещё два слоя.
<html> <head> <title>Дивный дизайн</title> <meta http-equiv="Content-Type" content="text/html; charset="windows-1251"> </head> <body> <div>Первый блок</div> <div>Второй блок</div> <div>Третий блок</div> </body> </html>Ну и смотрим как получилось.
Рейтинг:
+2
Просмотры: 2011Комментарии (3) »