Приднестровская поддержка XOOPS
Можно ли с помощью метода, описанного в разделе «Создание «резинового» макета с двумя колонками, в котором слева расположено меню, а справа – основная область с контентом», создать макет, в котором меню расположено справа?
Решение
Конечно, это можно сделать с помощью того же метода! Для этого нужно переместить меню слева направо и задать для области с контентом большой внешний отступ справа, чтобы освободить для меню место. Результат показан на рис. 9.31.
Рис. 9.31. Создание двухколоночного макета с меню справа
Обсуждение
Чтобы разместить меню справа, не нужно вносить никаких изменений в разметку документа – достаточно всего лишь изменить свойства, задающие позиционирование элемента nav и внешние отступы для элемента content:
chapter09/2col-reverse.css
#nav {
position: absolute;
top: 5em;
right: 1em;
width: 14em;
}
#content {
margin-left: 2em;
margin-right: 16em;
}
В этом случае преимущества использования абсолютного позиционирования налицо. Неважно, где наше меню находится в разметке документа – при использовании абсолютного позиционирования оно будет удалено из основного потока элементов, и его можно разместить в любом месте страницы. Это очень удобно с точки зрения доступности сайта, поскольку разработчик может разместить менее важные элементы (например, список ссылок на другие сайты, рекламу и т. д.) в конце кода документа. Таким образом, пользователям экранных дикторов не придется тратить время на прослушивание этой маловажной информации при каждом обращении к странице. В то же время для достижения желаемого визуального эффекта вы можете позиционировать элементы в любом месте страницы.
Отправитель | Нити |
---|
3 пользователь(ей) активно (2 пользователь(ей) просматривают Инструкции)
Участников: 0 Гостей: 3 далее... |