<div id="container">
<div id="header">
<p class="hdr2">Имя Вашей компании</p>
<div id="head2"></div>
</div>
<div id='content'>
<div class='hdr1' id="head4">
</div>
<div id='left_block'>
<div class="news">
<p class='head_block_news'>шапко</p>
<p class='content_block_news'> контент</p>
<p class='author_block_news'> автор</p>
</div>
<div class="news">
<p class='head_block_news'>шапко</p>
<p class='content_block_news'> контент</p>
<p class='author_block_news'> автор</p>
</div>
<div class="news">
<p class='head_block_news'>шапко</p>
<p class='content_block_news'> контент</p>
<p class='author_block_news'> автор</p>
</div>
</div>
<div id='right_block'>
<ul>
<li> <a href="#" title=''> Переход О деятельности</a></li>
<li> <a href="#" title=''> Наши партнеры</a></li>
<li> <a href="#" title=''> Наши координаты</a></li>
<li> <a href="#" title=''> О разработчиках</a></li>
<li> <a href="#" title=''> Полезные ссылки</a></li>
</ul>
</div>
</div>
</div>
Проблема с семантической версткой (HTML)
просьба удалить!
Цитата: duplet
Обучения меня идет сверху вниз, то есть изначально изучал пхп, теперь что "проще", но оказалась проблема. Как сделать, чтобы ИМЕННО СЕМАНТИЧЕСКИМИ методами, без таблиц, текст был в нужном месте?
п.с. необходимо написать какой нить текст в заголовках блоков слева, и краткую новость ниже. а также вписать текст в меню сверху слева (вместо слов, написанных прямо в картинках). все требуется сделать через ксс. Это нетрудно, но без подсказки сделать не могу. Кто сделает все сам, и скинет готовое - можно подумать о вознаграждение в районе 3 вмз. Спасибо за содействие!
http://ifolder.ru/19979957 - весь мой проект
п.с. необходимо написать какой нить текст в заголовках блоков слева, и краткую новость ниже. а также вписать текст в меню сверху слева (вместо слов, написанных прямо в картинках). все требуется сделать через ксс. Это нетрудно, но без подсказки сделать не могу. Кто сделает все сам, и скинет готовое - можно подумать о вознаграждение в районе 3 вмз. Спасибо за содействие!
http://ifolder.ru/19979957 - весь мой проект
проект не качал,а так все элементарно
в гугле:
css float
css position
пример
<div>
<div style='position: relative; top: 100px; left 200px; right: 200px; bottom: 100px;'>
</div>
</div>
по аналогии так можно блок куда угодно переместить на странице.
Цитата: webmac
проект не качал,а так все элементарно
в гугле:
css float
css position
пример
<div>
<div style='position: relative; top: 100px; left 200px; right: 200px; bottom: 100px;'>
</div>
</div>
по аналогии так можно блок куда угодно переместить на странице.
в гугле:
css float
css position
пример
<div>
<div style='position: relative; top: 100px; left 200px; right: 200px; bottom: 100px;'>
</div>
</div>
по аналогии так можно блок куда угодно переместить на странице.
вот проблема втом, что такой же код делается в Дримвивере, и буквы слетают куда угодно, только не на место - мпричем положениебукв меняется в зависимости от размеров окна
Цитата: duplet
вот проблема втом, что такой же код делается в Дримвивере, и буквы слетают куда угодно, только не на место - мпричем положениебукв меняется в зависимости от размеров окна
Семантическая верстка в визуальном редакторе? Мсье знает толк в извращениях...
Цитата: duplet
вот проблема втом, что такой же код делается в Дримвивере, и буквы слетают куда угодно, только не на место - мпричем положениебукв меняется в зависимости от размеров окна
да жестоко ты шаблон сверстал, в общем
[HTML]<div id="header">
</div>
после блок с контентом
<div id='content'>
<div id='left_block'>
<div class='news'>
<p>текст отсюда не куда позиционировать не надо</p>
</div>
<div class='news'>
</div>
</div>
<div id='right_block'>
тут все что справа
</div>
</div>[/HTML]
Цитата: RussianSpy
Семантическая верстка в визуальном редакторе? Мсье знает толк в извращениях...
Кстати не факт (я не этот случай имею в виду). Просто у меня один друг раньше верстал в дримвивере и я ни разу не видел его в визуальном режиме (верстал кстати неплохо). Просто тогда не было аптаны, а всяческие хвалёные notepad++ автокомплит не умеют.
Не гоните на Дримвивер! Пишет нормальный код и табы ставит как положено. На код приятно смотреть.
А автора нужно просто ткнуть в _http://htmlbook.ru
Учите CSS. учите особенности position, top, left, margin, padding и будет вам счастье.
За недельку (а-то и меньше) я научился клепать блоки так как мне нужно и без дрима, и если нужно сделать простой вывод - это делается в ноутпад++ уже а не в дриме. Дрим - хорошая подсказка к коду, параметрам тегов и т.д.
З.Ы. Дрим информативнее раскрашивает код, чем ноутпад++.
А автора нужно просто ткнуть в _http://htmlbook.ru
Учите CSS. учите особенности position, top, left, margin, padding и будет вам счастье.
За недельку (а-то и меньше) я научился клепать блоки так как мне нужно и без дрима, и если нужно сделать простой вывод - это делается в ноутпад++ уже а не в дриме. Дрим - хорошая подсказка к коду, параметрам тегов и т.д.
З.Ы. Дрим информативнее раскрашивает код, чем ноутпад++.
ну вот это то все понятно. но какой конкретно код нужен, чтобы допустим, запомнилнить одну колонку под Testimonials - при том чтобы всиней облатси был заголовок новости, а ниже - в светлоголубой - нбольной примр текста. Я дальше на этом примере сам разберусь. А то внятного ответа никто ине дал - все посылают на учебники - учибники я проштудировал. но как именно туда текст запихнуть не понимаю. Именно в ту точкУ, и чтобы через ксс и не съезжало. Ибо если вдримвивере делаешь "нарисовать слой" - все нормально вроде бы, но буквы съезжают.
Цитата: duplet
ну вот это то все понятно. но какой конкретно код нужен, чтобы допустим, запомнилнить одну колонку под Testimonials - при том чтобы всиней облатси был заголовок новости, а ниже - в светлоголубой - нбольной примр текста. Я дальше на этом примере сам разберусь. А то внятного ответа никто ине дал - все посылают на учебники - учибники я проштудировал. но как именно туда текст запихнуть не понимаю. Именно в ту точкУ, и чтобы через ксс и не съезжало. Ибо если вдримвивере делаешь "нарисовать слой" - все нормально вроде бы, но буквы съезжают.
Код:
и стили
Код:
.news { background-image: url(4.jpg); width: 266px; height: 120px; background-repeat: no-repeat; }
#right_block { position: relative; left: 450px; bottom: 300px;}
#left_block {position: relative; bottom: 88px;}
.head_block_news {position: relative; color: red; left: 20px;}
.content_block_news {position: relative; color: red; left:20px; top: 20px;}
.author_block_news {position: relative; color: red; left: 150px; top: 55px; }
</style>
#right_block { position: relative; left: 450px; bottom: 300px;}
#left_block {position: relative; bottom: 88px;}
.head_block_news {position: relative; color: red; left: 20px;}
.content_block_news {position: relative; color: red; left:20px; top: 20px;}
.author_block_news {position: relative; color: red; left: 150px; top: 55px; }
</style>
подправил, забирай.
Идентификаторы для документа уникальны, используй классы для повторяющихся блоков.
Меню списком должно быть а не дивами.
Спасибо большое! Разобрался!
Цитата: duplet
Спасибо большое! Разобрался!
читаем, пожалуйста, шапку! тема снова актуальна!!!!!!