Применение каскадных таблиц стилей |
Каскадные таблицы стилей имеют множество преимуществ. По возможности стоит разделять структуру отчётной формы и оформление отчёта.
Язык разметки является основой для создания отчётных форм и таблицы стилей не заменяют его. Они являются самостоятельной технологией, которая применяется непосредственно к тегу.
Информацию о стиле элементов можно включить в отчётную форму тремя способами:
• связать отчётную форму с внешней таблицей стилей;
• внедрить глобальную таблицу стилей в заголовок отчётной формы;
• определить внутренний стиль для отдельного элемента.
Все правила форматирования элементов отчётной формы могут быть вынесены в отдельный файл с расширением .css. Файлы с описаниями стилевых описаний могут располагаться где угодно. В отчётную форму внешний файл с описанием таблиц стилей присоединяется с помощью тега <link>, который располагается в разделе <head>. В качестве параметра rel тега <link> нужно указать значение stylesheet, в параметре type – "text/css", а в параметре href – полный путь к стилевому файлу.
<head>
<link rel="stylesheet" type="text/css" href="C:\СБиС++
Хозрасчетный учет\Модули\!sbis\Отчёты\my.css">
<title>
заголовок отчёта
</title>
</head>
Пример внешней таблицы стилей можно посмотреть в папке <Модули\!sbis\main.css>. Этот файл автоматически присоединяется программой СБиС++ к любой создаваемой в ней отчётной форме.
Оформление большинства отчётов должно быть одинаковым или схожим. Разумно разработать единую для всех отчётов стилевую спецификацию, вынести ее во внешний файл и каждый раз использовать при построении отчётных форм. Это упростит задачу поддержания общего стиля и облегчит обновление отчётных форм.
Стилевые спецификации можно записать непосредственно в отчётной форме. Для этого нужно в разделе head поместить элемент <style>, а внутри пары <style> и </style> записать все правила форматирования.
Можно размещать несколько элементов <style> в разделе head одной отчётной формы. Так же возможно сочетание внешней таблицы стилей и внедрения таблиц в текст отчётной формы.
Ниже приведен пример внедрения описания стилей в раздел head отчётной формы:
<head>
<style>
body { font-family: arial;
text-align: left; }
h1 { font-size: 20pt;
text-align:
center;
color: red; }
</style>
<title>
заголовок отчёта
</title>
</head>
Третьим вариантом добавления стилевых таблиц является применение их к конкретному элементу отчётной формы. Для этих целей у большинства тегов существует параметр style. Правила форматирования указываются в кавычках в качестве значения этого параметра. Рассмотрим пример определения внутреннего стиля для элемента <h1>:
<h1 style="font-size: 20pt; text-align: center; color: red;"> заголовок первого уровня </h1>