Шаблон:Test3 — различия между версиями
Материал из Integra-S Wiki
Wikiadmin (обсуждение | вклад) |
Wikiadmin (обсуждение | вклад) |
||
Строка 1: | Строка 1: | ||
<html> | <html> | ||
<head> | <head> | ||
− | <title>Пример блочной верстки</title> | + | <title>Пример жесткой блочной верстки сайта в три колонки</title> |
<style type="text/css"> | <style type="text/css"> | ||
− | div#block {width: | + | div#block {width:750px; margin:0 auto; background-color:#dddddd} |
− | div.header {width: | + | div.header {width:750px; height:100px; background-color:#717dc9} |
− | div.left_col {width:148px; height:350px; float:left; border-right:2px dashed #717dc9} | + | div.left_col {width:148px; height:350px; float:left; border-right:2px dashed #717dc9; margin-bottom:-15px} |
− | div.right_col {width: | + | div.center_col {width:450px; float:left} |
− | div.footer {width: | + | div.right_col {width:148px; height:350px; float:left; border-left:2px dashed #717dc9; margin-bottom:-15px} |
+ | div.footer {width:750px; height:70px; background-color:#717dc9; clear:both} | ||
</style> | </style> | ||
</head> | </head> | ||
Строка 14: | Строка 15: | ||
<div class="header"><h1 align="center">Верстка сайта</h1></div> | <div class="header"><h1 align="center">Верстка сайта</h1></div> | ||
<div class="left_col"><p align="center">Меню</p></div> | <div class="left_col"><p align="center">Меню</p></div> | ||
− | <div class=" | + | <div class="center_col"> |
<h2 align="center">CSS верстка сайта</h2> | <h2 align="center">CSS верстка сайта</h2> | ||
<h4 align="center">Жесткая верстка блоками</h4> | <h4 align="center">Жесткая верстка блоками</h4> | ||
</div> | </div> | ||
+ | <div class="right_col"><p align="center">Ссылки</p></div> | ||
<div class="footer"><p>© 2010</p></div> | <div class="footer"><p>© 2010</p></div> | ||
</div> | </div> | ||
</body> | </body> | ||
</html> | </html> |
Версия 18:58, 26 октября 2017
<html> <head> <title>Пример жесткой блочной верстки сайта в три колонки</title> <style type="text/css"> div#block {width:750px; margin:0 auto; background-color:#dddddd} div.header {width:750px; height:100px; background-color:#717dc9} div.left_col {width:148px; height:350px; float:left; border-right:2px dashed #717dc9; margin-bottom:-15px} div.center_col {width:450px; float:left} div.right_col {width:148px; height:350px; float:left; border-left:2px dashed #717dc9; margin-bottom:-15px} div.footer {width:750px; height:70px; background-color:#717dc9; clear:both} </style> </head> <body>
Верстка сайта
Меню
CSS верстка сайта
Жесткая верстка блоками
Ссылки
</body> </html>