Практика разработки Web-страниц

Сервисный центр ремонт компьютеров быково заменит материнскую плату.

Форматирование и макет отличаются на разных страницах сайта - часть 2


увеличить изображение
Таблица стилей содержит описание форматирования для тэгов HTML. ТopStyle показывает эффект от применения ваших стилей на панели внизу

Добавьте определения стилей в тэги HTML. Например, эти определения стиля задают заголовкам шрифт Courier зеленого цвета:

h1,h2,h3 { font-family:Courier, "Courier New",serif; color:#003300; }

  • Подключитесь к таблице стилей на вашей странице с помощью тэга <LINK>:

    <link rel=stylesheet type="text/css " href="styles.css">

  • Просмотрите получившиеся страницы. Если элементы выглядят неправильно, добавьте или модифицируйте определения в тэгах HTML. Если у вашей страницы есть области со специальным форматированием, добавьте отдельный класс (class) в файл таблицы стилей и определите в нем стиль для элементов страницы этого класса. В таблице стилей перед именами классов ставится точка.

    .WhiteOnBlue { background:#000066; color:#ffffff; }

    Примените стиль для нужных тэгов, используя атрибут class. Например, следующий блок <DIV> в сочетании с вышеприведенным определением стиля создает на странице область с белым текстом на синем фоне:

    <div class=WhiteOnBlue> <!--This is the reversed area of the page --> </div>

  • Если результат, полученный с помощью таблицы стилей, вас удовлетворяет, примените ее к другим страницам, предвартельно удалив с них тэг <FONT> и другую информацию о форматировании.

    Большинство броузеров поддерживают основные свойства таблиц стилей, такие как тип (гарнитура) шрифта и цвет. Если ваши посетители не используют старые версии броузеров, лучше использовать стили. Но если вы хотите, чтобы ваши страницы выглядели одинаково во всех броузерах, не используйте их. Подробнее см. раздел "Поддержка броузера для CSS".




  • Начало  Назад  Вперед