12.09.2016, 20:56 | #1 | ||
Кандидат наук
Регистрация: 13.06.2005
Адрес: 0x00000000
Сообщений: 8,354
Репутация скрыта
|
Тег P против DIV
Итак, у меня есть некий документ, допустим: Код HTML:
<P>Первый абзац документа</P> <P>Второй абзац</P> Код:
.document_container { position: relative; padding-left: 20px; } .menu { position: absolute; left: 0px; width: 20px; height: 20px; /*тут ещё background со значком и прочие мелочи*/ } .menu_items { position: relative; z-index: 1; display: none; /*отступы и прочие мелочи*/ } .menu:hover .menu { display: block; } Код HTML:
<div class="document_container"> <P> <div class="menu"> <div class="menu_items">Содержимое всплывающего меню</div> </div> Первый абзац документа </P> <P> <div class="menu"> <div class="menu_items">Содержимое меню для второго абзаца</div> </div> Второй абзац </P> </div> привязан к его местоположению. Но из-за position: absolute и явно заданной left-координаты он выносится на поля. При наведении на menu курсора мыши срабатывает селектор "menu:hover .menu", и содержимое меню становится видимым. Тут ничего хитрого. Однако, из-за того, что тег <P> не обязательно закрывать и он сам закрывается при встрече блока, ломается структура документа, как только я добавляю div с меню (потому что тег <P> открыт перед ним, но закрыт после него)! DIV с меню на SPAN заменить нереально - ведь там должны быть именно блоки! Поэтому вопросы: 1) насколько обязательно применять <P> с точки зрения работы с сайтом поисковых машин и прочего. Есть ли у тега <P> какое-то реальное отличие от <DIV> помимо его дурацкого автозакрытия? 2) есть ли другой путь сделать менюшку, привязанную к определённому месту в тексте (собственно, вынесена она на поля, или просто встречается в тексте, не так важно)?
__________________
Товарищ, верь: пройдет она - Эпоха лживых, злых понятий. Весь мир очнется ото сна, И на обломках "демократий" Напишут наши имена! Мы были волшебницами (оригинальное фентези) Тень Войны (фанфик по ГП) |
||
|
|