Здравствуйте, нарисовал нам с девушкой сайт(прим. в прикрепленных изображениях), но не могу навести порядок в голове, разложить все по полочкам. Не могу понять как правильнее порезать и собрать в html+css.
Не прошу что либо делать за меня, но прошу направить на путь истинный, помочь советом. )
Моих знаний и глубины понимания css хватает только для реализации растягивающегося контента с помощью таблицы, но в итоге из-за того что я использую .png с прозрачностью, то там идет просвет фона через картинку и + ко всему пропадает возможность что-то набирать(контент, т.к. ползет картинка).
И еще почему то все это дело не выравнивается по середине окна браузера. (посмотреть мой неутешительный вариант можно
А так же нам нужна простенькая галерея с возможностью редактирования через админку или любым другим способом но только не через html(девушка) с как можно минимальным количеством графических элементов(кнопочки, стрелочки, фоны и т.д.) И что бы можно было ее в эту самую зону на сайте для контента разместить. + Еще нужен простенький блог, те же требования что и у галереи. Ну и гостевую, тоже самую простую...
Может кто будет добр подкинуть информацию где это дело взять, будем очень благодарны!) Правда это не главное, постараюсь сам все найти, главнее правильно собрать...
П.С. Понимаю что многие сайт посчитают плохим, в плане веса и функционала и.т.д., но он делался в первую очередь для себя, таким каким мы его хотим видеть, поэтому попрошу не критиковать по этому поводу.
CSS:
HTML:
Всем спасибо за внимание!
Не прошу что либо делать за меня, но прошу направить на путь истинный, помочь советом. )
Моих знаний и глубины понимания css хватает только для реализации растягивающегося контента с помощью таблицы, но в итоге из-за того что я использую .png с прозрачностью, то там идет просвет фона через картинку и + ко всему пропадает возможность что-то набирать(контент, т.к. ползет картинка).
И еще почему то все это дело не выравнивается по середине окна браузера. (посмотреть мой неутешительный вариант можно
You must be registered for see links
)А так же нам нужна простенькая галерея с возможностью редактирования через админку или любым другим способом но только не через html(девушка) с как можно минимальным количеством графических элементов(кнопочки, стрелочки, фоны и т.д.) И что бы можно было ее в эту самую зону на сайте для контента разместить. + Еще нужен простенький блог, те же требования что и у галереи. Ну и гостевую, тоже самую простую...
Может кто будет добр подкинуть информацию где это дело взять, будем очень благодарны!) Правда это не главное, постараюсь сам все найти, главнее правильно собрать...
П.С. Понимаю что многие сайт посчитают плохим, в плане веса и функционала и.т.д., но он делался в первую очередь для себя, таким каким мы его хотим видеть, поэтому попрошу не критиковать по этому поводу.
CSS:
Код:
@charset "windows-1251";
body {
font: 100% Verdana, Arial, Helvetica, sans-serif;
background: url(../i/bg.jpg);
padding: 0;
margin: 112px 0 0 0;
text-align: center;
}
#all {
width: 969px;
height: auto;
padding: 0;
margin: 0;
min-height: 969px;
}
#head {
width: 969px;
height: 292px;
}
#headimg {
width: 969px;
height: 225px;
background: url(../i/h.png) no-repeat;
padding: 0;
}
#nav {
width: 969px;
height: 67px;
}
#navimg {
width: 969px;
height: 67px;
background: url(../i/nav.png) no-repeat;
}
#content {
width: 969px;
height: auto;
}
#tables {
width: 969px;
height: auto;
}
#contleftrep {
background: url(../i/cont_l_r.png) repeat-y;
width: 180px;
height: auto;
}
#contcentrrep {
background: url(../i/cont_c_r.png) repeat-y;
width: 583px;
height: auto;
}
#contrightrep {
background: url(../i/cont_r_r.png) repeat-y;
width: 217px;
height: auto;
}
#contleftimg {
width: 180px;
height: 273px;
background: url(../i/cont_l.png) no-repeat;
}
#contcentrimg {
width: 583px;
height: 273px;
background: url(../i/cont_c.png) no-repeat;
}
#contrightimg {
width: 217px;
height: 273px;
background: url(../i/cont_r.png) no-repeat;
}
#pleft {
height: 408px;
width: 180px;
background: url(../i/p_l.png) no-repeat;
}
HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<title>Infected-art.ru|Главная</title>
<link href="css/cell.css" rel="stylesheet" type="text/css" />
<style type="text/css"></style>
</head>
<body>
<div id="all">
<div id="head">
<div id="headimg"></div>
<div id="nav">
<div id="navimg"></div>
</div>
</div>
<div id="content">
<table id="tables" border="0" cellpadding="0" cellspacing="0">
<tr>
<td id="contleftrep"><div id="contleftimg"></div></td>
<td id="contcentrrep"><div id="contcentrimg"></div></td>
<td id="contrightrep"><div id="contrightimg"></div></td>
</tr>
<tr>
<td id="pleft"></td>
<td id="pcentr"></td>
<td id="pright"></td>
</tr>
</table>
</div>
</div>
</body>
</html>
