Главная Вход в систему Регистрация
Задать вопрос Консультации Пользователи Форум
О системе Помощь
Задать вопрос экспертам
Консультация № 181083
03.12.2010, 12:52
0.00 руб.
0 4 1
Компьютеры Интернет и сети
Здравствуйте, уважаемые эксперты! Прошу Вас ответить на следующий вопрос:
Хотя я практически не разбираюсь в web-дизайне, мне было поручено создание корпоративного сайта. Для простоты решил использовать CMS Joomla (да простят мне "простоту" профессионалы этого дела).
Как "полный новичок" шаблон делал в программе Artisteer. Примерный макет шаблона указан в приложении.

Суть в следующем - сайт должен без масштабирования отображаться на экранах с любым разрешением.
Информативный блок (БЛОК3 в макете) центрирован и не должен менять своих размеров при изменении разрешения экрана.
В хедере кроме картинки есть ещё и текст, который при растягивании хедера на весь экран сам растягиваться не должен (прихоть заказчика).
Тоже самое в футере.
Горизонтальное меню центрировано и размеры элементов меню чётко указаны в пикселях, поэтому при изменении расширения экрана, они вроде бы не меняют своих размеров.
БЛОК1 и БЛОК2 никакой функциональной нагрузки не несут. Никаких элементов в них нет. Я их использовал лишь для того, чтобы за их счёт "закрепить" положение и размеры центрального блока БЛОК3 - не получилось.

Итак сформулирую вопросы:
1) Каким образом можно зафиксировать блок или модуль под расширения так, чтобы он находился всегда в центре экрана и имел размер, допустим 500х400рх?
2) Каким образом можно отобразить в области хедера и футера текст (не изображение с текстом!)? Возможно его нужно позиционировать по координатам в зависимости от разрешения экрана.
3) Как задать высоту области хедера и футера так, чтобы она была равна: ("высота экрана" - "высота меню" - "высота инф. блоков")/2? Высота меню и высота блоков - константы.

Сразу прошу знатоков не тратить время на объяснение мне моей безграмотности в данном вопросе. Уверен, мои "проблемы" решаются добавлением десятка строк в index.php или templates.css,
но что и куда именно добавить - это я пока так и не понял.
Очень надеюсь на Вашу помощь. Буду рад любому совету по существу вопроса.

Приложение:

Обсуждение

давно
Асмик Гаряка
Профессор
230118
3054
03.12.2010, 13:15
общий
это ответ
Здравствуйте, Dipauler!

1) Каким образом можно зафиксировать блок или модуль под расширения так, чтобы он находился всегда в центре экрана и имел размер, допустим 500х400рх?

К данному слою примените стиль
Код:
 <style type="text/css">
   .center {
    width: 500px; /* Ширина слоя в пикселах */
    height:400px;
    margin: 0 auto; /* Выравниваем по центру */
   }
  <div class="center">
    Lorem ipsum dolor sit amet...
   </div>


Internet Explorer 6 в режиме совместимости (quirk mode) не поддерживает выравнивание блока по центру с помощью правила margin: 0 auto. Это не должно смущать, потому что его уже почти никто не использует.

2) Каким образом можно отобразить в области хедера и футера текст (не изображение с текстом!)? Возможно его нужно позиционировать по координатам в зависимости от разрешения экрана.
[code] position: absolute; /* Абсолютное позиционирование */
bottom: 1px; /* Положение от нижнего края */
width:100%;
3) Как задать высоту области хедера и футера так, чтобы она была равна: ("высота экрана" - "высота меню" - "высота инф. блоков")/2? Высота меню и высота блоков - константы.
Возможно, надо использовать фреймы
5
Спасибо за Ваши ответы.<br>Для центрирования блока я использовал в итоге другой способ:<br>#Center {<br> width:500px;<br> height:400px;<br> position:absolute;<br> left:50%; /* смещаем блок вправо на 50% ширины родительского блока */<br> top:50%; /* смещаем блок вниз на 50% высоты родительского блока */<br> margin:-250px 0 0 -200px; /* смещаем блок вверх и влево на 50% высоты и ширины самого блока */<br>}<br><br>Работает. И вроде бы позволяет обойти "неприятности" с отображением margin 0 auto в IE6.<br>К сожалению, сайт нужно сделать сразу и чётко - чтобы отображался одинаково хорошо во всех браузерах.<br>
Неизвестный
03.12.2010, 18:02
общий
Адресаты:
Не поможете ли мне с ещё одной проблемой?
Как я уже писал в вопросе, шаблон для сайта я делал в Artisteer.
После этого выкинул из файла index.php из области тега <body> всё, кроме следующих строк:
<div class="PageContent">
<jdoc: include type="component" /> </div>
То есть вывожу блок, в который должен выводиться текст статей в Joomla. Класс ".PageContent" я создал сам и мам же описал его в templates.css:
.PageContent
{
position: absolute; top: 85px; height: 255px; width: 50%;
font-size: 13px; color: #FFFFFF;
}

.PageContent p {margin: 10px 10px 10px 10px;}

При этом текст сообщений почему-то вылезает из области блока снизу и справа. Я-то надеялся, что текст сообщений будет чётко умещаться в границах моего блока.

Так вот вопрос - я неправильно указал параметры класса или же где-то могут быть переопределены параметры вывода текста статей в модуль <jdoc: include type="component" />?
Буду очень благодарен, если потратите время на комментарий.
давно
Асмик Гаряка
Профессор
230118
3054
03.12.2010, 19:14
общий
Попробуйте эти параметры описать в самом файле html. Если не подействует, значит, причина в другом. css ближний перекрывает дальний.
Неизвестный
03.12.2010, 20:05
общий
Адресаты:
Спасибо.

Цитата: Асмик Гаряка
Попробуйте эти параметры описать в самом файле html. Если не подействует, значит, причина в другом. css ближний перекрывает дальний.


Значит, указанные мной параметры всё же верны? Попробую действительно прописать стиль прямо в html.
Форма ответа