Каким образом верстать сайт такого типа?

Temateee · May 11, 2011

Верстаю в первый раз, прочитал про вёрстку div-ами, но там только про "резиновые сайты", хочу фиксированный с вот такой структурой.

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

Great Rash · May 11, 2011

http://htmlbook.ru/layout

leonid26 · May 11, 2011

<div class="head" style="height:высота;position:relative">
 <div class="logo" style="width:ширина;height:высота;margin:устанавливаем позицию">
  Логотип
 </div>
 <div class="menu" style="position:absolute;bottom:0px;right:правый отступ">
  Меню
 </div>
</div>
<div class="wrap" style="margin-bottom:если нужно видить гроунд">
 <div class="sidebar" style="float:left;width:ширинаХ;margin:нужныеОтступы">
  Боковая панель
 </div>
 <div class="main" style="margin-left:ширинаХ">
  Контент
 </div>
</div>

Edited May 11, 2011 by leonid26

Softlink · May 11, 2011

на коленке набросал:


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ru-ru" lang="ru-ru"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=Windows-1251" />
</head>
<style>
.wrap{
width:1007px;
margin:0 auto;
}
.header{
height:200px;
}

.logo{
float:left;
height:100px;
width:150px;
font-size:24px;
background:#cccccc;
}

.content{
height:100%;
overflow:hidden;
}

.menu-left{
float:left;
margin-top:80px;
margin-left:40px;
width:260px;
height:400px;
background:#999999;
}

.menu{
float:right;
width:300px;
height:30px;
margin-right:30px;
margin-bottom:3px;
background:#999999;
}

.text{
float:right;
height:1000px;
width:707px;
background:#cccccc;
}
</style>

	<body>
		<div class="wrap">
			<div class="header">
				<div class="logo">Логотип</div>	 
			</div>

			<div class="content">
				<div class="menu-left">меню левое</div>
				<div class="menu">меню</div>
				<div class="text">текст</div>
			</div>

		<div class="footer"></div>
		 </div>
   </body> 
</html>

Temateee · May 11, 2011

http://htmlbook.ru/layout

Если я не ошибаюсь то "Фиксированная ширина, навигация слева".

Softlink спасибо.

Edited May 11, 2011 by Temateee

Softlink · May 11, 2011

да не за что. Но это совсем сырой макет, так, чтобы в общих чертах стало ясно.

Sign In

Каким образом верстать сайт такого типа?

Question

Temateee

Link to comment

Share on other sites

5 answers to this question

Recommended Posts

Great Rash

Link to comment

Share on other sites

leonid26

Link to comment

Share on other sites

Softlink

Link to comment

Share on other sites

Temateee

Link to comment

Share on other sites

Softlink

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information