400
Глава
13. Позиционирование элементов
на веб-сrранице
-t.
1#1!<11 ipS<rn dolor S>t ame<, ~ adipiSOng e11t. secl<lom nonunmy niЬh eul:smod бncld\rt ut - - dolore megna olkjui!m mot IIOiu!po~ Ut wlsl orlm 8d mlnim ..,....",, quh nos1rud ~ IJ>tloo ull.>rnawpor susc1p1t 1o1>arns niSI ut ali<J,IIp ех"" a>mmoclo Duls aUO>m Yel eum I<Ue.
& Rubbc1· Dщ.:kies Needn'tAppJy 1#1!<11 IPSUМ dolor Slt •met. consecte...., IOPIS<It>g eht, secl diom """""""V n.l>h eul:smod tloodun! ut looreet dolore mogra afoqwm erat IIOIU!pat., щ wisl Мт ad mlnim - . quh nos11uc1 e>erd "'""" uflamcorper $U$0Pft loOor1ls niSI ut allquip б еа mrnmoclo - L Duls .-oe~
...... lrkn.
LDrem IPS""' dolor s4 ame1, Conse<%etUer Э<~Cpisclr>g ebt, sec1 dlam """""""У niЬh eul:smod tlncldunt ut dolore mogna ollquam erat \IOiu!pot. Ut Wlsl мm ad mlnim - . quh nasi>'Ud ._d "'""" Ullamcorper W ! d p l t - nls! ut ollquip ех еа a>mrnO<Io - L Duls
ouwn "'' eum lrkJr•.
&
Cast-Iroл No-Nos
1#1!<11 lpwm dolot "'' amet. ~ aOplsclng ellt. secldlam nonunmy niЬh eul:smod tlncldunt ut laoreet dolote megna allquam "'"' \IOIU!pat. Ut wbl orlm ad mlnfm ..,...m, quiS nosoud ~d ~J>tloo ui~J>mcorper SU$(jplt k>Ьol1fs risl ut allqЩ> ех еа a>mmoc1o -~ Duls
Рмс.
1 3.11. Страница с фреймами, соэданная
посредством
CSS. Полоса
прокрутки (выделено
кружком) поэволяет прокручивать только большую текстовую область; верхний и нижний баннеры и боковое меню остаются неподвижными
ПРИМЕЧАНИЕ----------------------------------------------- Фиксированное позиционирование не работает в Iпternet
Explorer версий б и ниже. Однако всего 5 ниже) вы можете заставить страни
с небольwим дополнительным СSS-кодом (оnисанным в шаге цу выглядеть nрекрасно и в
Intemet Explorer б (хотя «фиксированные элементы» в итоге nрокручи Internet Explorer 7 и 8 расnознают фиксированное
ваются наряду с остальными). Поскольку же
позиционирование, можете использовать эту методику и nолучить подобные результаты дпя всех
nосетителей вашего сайта.
Фиксированное позиционирование работает во многом подобно абсолютно му
-
вы точно так же можете исnользовать свойства
top, bottom, 1eft или ri ght для
размещения элемента. Как и абсолютное, фиксированное позиционирование уда ляет элемент из потока
HTML. Он ~плавает~
над другими частями страницы, ко
торые просто игнорируют его.
Рассмотрим, как можно создать страницу, похожую на изображенную на рис.
13.11,
у которой есть фиксированный баннер, боковое меню и нижний колонтитул, а так же прокручиваемая область с главным содержимым.
1.
Добавьте теги
<div> с
атрибутами
ID для каждого раздела страющы. У вас <di v> с такими 10, как banner, sidebar, main котором вы указываете эти теги в HTML, не
может быть четыре основных тега и
footer
(рис.
13.12). Порядок, в
имеет значения. Как и абсолютное позиционирование, фиксированное позво ляет вам размещать элементы на странице независимо от их расположения
вНТМL.