В предыдущем учебнике мы обсуждали несколько иной процесс создания страницы. Вместо того, чтобы создавать CSS шаблон по готовому дизайну, мы сделаем наоборот – сначала заготовим пустой CSS файл для Joomla. Это нужно для того, чтобы любой другой человек смог воспользоваться им, изменив его по своему усмотрению. Начнем с базового пустого шаблона, без листа, только стилизация шрифтов. Это не окончательный CSS файл, в нем не нужно заполнять все стили.
Такой пустой CSS файл обладает следующими свойствами:
CSS Краткость Используются сокращенная форма записи стилей в начале каждого определения. Как только разберетесь со стилями, удалите полные версии, заменив их сокращенными. Синтаксис их такой: font: font-size |font-style | font-variant | font-weight | line-height | font-family
Например: font-size:100%; font-family:Arial,Helvetica,sans-serif; font-style:italic; font-weight:bold; line-height:130%em; заменится на font: 100%/130% Arial,Helvetica,sans-serif italic bold;
Глобальный CSS сброс В начале CSS файла Joomla располагаются параметры, задающие характеристики остальных стилей. Нам придется их обойти. Первый параметр глобального стиля такой:
* { margin: 0; padding: 0; } body {........ font-size: 76.1%;........ Теперь всем составляющим стиля присвоено нулевое смещение и паддинг, и затем размер шрифта установлен в 76,1%. Размер шрифта подобран так, чтобы большинство броузеров воспринимало его как сконцентрированный.
Теги заголовков и Joomla CSS заголовки. Иногда приходится отключать Joomla заголовки и использовать в контенте теги h1/h2. Это нужно для SEO. Аналогичного результата можно добиться сохранив Joomla заголовки видимыми, но спрятав их через CSS и убрав на них ссылки. Например:
display: none;
height:0;
text-indent: -3000px;
Для упорядочивания и стандартизации заголовков (независимо от того, видимы они или нет) воспользуемся тегами hX. Например:
h1,.componentheading {...
Скругленные углы Joomla. В конце CSS файла расположен код для скругления углов. Аналогичная технология использована в joomla.org, для нее требуется, чтобы module suffix в файле index.php был равен -3. Все, готово. Теперь у вас есть пустой шаблон Joomla. Он еще не содержит листа, мы создадим его в следующий раз. Вы можете скачать этот шаблон здесь .
