Октябрь 4, 2008
Posted by admin
Верстка HTML при помощи div (дивов)
Представим себе простую игру тетрис. Как всем известно, в этой игре фигуры разной формы падают сверху. И задача расставить их в нужном порядке, чтобы не оставалось пустых мест в строках. Как только завершена очередная строка мы получаем за нее очки и она исчезает.
Но при чем же здесь HTML спросите вы? Ответ в том что верстка при помощи слоев очень похожа на эту игру. Только она еще проще, потому что мы сами можем заказывать себе фигуры нужной формы, и они всегда будут самыми простыми - прямоугольники и квадраты.
Берем PSD-исходник, выделяем на нем нужный нам слой под фон, это может быть какая-то большая картинка в шапке, ну и возможно градиент в подвале, тогда нужно будет их разрезать на две части и залить в середине нужным фоном. В результате мы получим код примерно следующего вида:
<div id=”header”></div>
<div id=”footer”></div>
Игровая зона будет определена при помощи основного слоя, в котором мы и будем играть в “тетрис”.
<div id=”content”>
Здесь контент
</div>
И теперь просто режем нужные нам кусочки и впускаем их в игровую зону, они будут “падать” в верхнюю часть страницы.
2 Comments
Декабрь 23, 2008
Интересно! Но я плохо понимаю пока в вёрстке и хотелось бы пройти начальный курс програмирования, а если не трудно то можно мне помочь советом : реально ли научиться или хотябы создать свой сайт в визуальных редакторах, скажем дня за 2-5?
Декабрь 23, 2008
Ефим, я начинал с визуальных редакторов. В DreamWeaver и FrontPage. Получались неплохие сайты для новичка.
Профессиональную вещь конечно трудно сделать при помощи визуального редактора. Тут действительно нужно знать хорошо HTML и CSS.
А для начала можно хоть в ворде странички рисовать
Leave a comment