logo search
123

Создание сайта с помощью приложения FrontPage

1. Для создания сайта с помощью приложения FrontPage необходимо открыть окно приложения одним из способов. После чего на экране будет отображаться окно приложения или графический интерфейс FrontPage, в котором будет отображаться  предыдущий сайт или страница. Для выхода из предыдущего сайта или страницы в FrontPage надо выполнить команду «Файл/Закрыть» или «Файл/Закрыть узел», либо то и другое, если были открыты узел и страница. Затем выполняем команду Файл / Создать и в отрывшейся области задач «Создание» щелкаем мышью на «Другие шаблоны веб – узлов» в разделе «Создать Веб-узел». Откроется окно диалога «Шаблоны веб – узлов», в котором необходимо выделить «Пустой веб – узел», далее указать расположение нового веб-узла (например, D:\Documents and Settings\ТВА\Мои документы\Мои веб-узлы\lessons-en101) и щелкнуть ОК. На рисунке представлен фрагмент окна диалога «Шаблоны веб – узлов», в котором указан адрес нового сайта.

После сохранения сайта на экране в окне приложения FrontPage будет отображаться новый веб-узел в режиме папки.

2. Создание в FrontPage домашней страницы для нового сайта. Создание домашней страницы в FrontPage можно осуществлять по-разному. Например, можно щелкнуть на кнопке «Создать страницу» на панели «Содержимое», в результате в окне веб-узла добавится страница index.htm, которая показана на рисунке

3. Затем копируем содержимое ранее созданной папки EN101, в которой находятся  папка images и страничка index (папка _vti_cnf формируется автоматически при создании веб-страницы). Содержимое папки EN101 представлено на рисунке.

Вставляем сохраненное содержание папки EN101 из буфера обмена во вновь созданную папку веб-узла lessons-en101, которая представлена на рисунке.

4. Далее дважды щелкаем на странице index.htm в открытом окне веб-узла, в результате главная страница откроется в режиме страница, которая показана на рисунке.

Таким образом, в качестве домашней страницы в новом сайте использована ранее созданная страница index.htm (Английский язык в Интернет). Можно создавать главную страницу и другими способами, изложенными в разделе 3.3.2. Знакомство с программой FrontPage. 5. Создаем в редакторе FrontPage структуру сайта , т.е. к главной странице добавим еще три страницы: info - О компании; business - Бизнес-обзор проекта; pay - Способы оплаты. Для этого надо перейти в режим Переходы, выполнив команду Вид/Переходы. Затем необходимо выделить домашнюю страницу и щелкнуть на кнопке Новая страница на панели Переходы или применить контекстное меню, добавится Новая страница 1. Аналогичным образом добавляем еще две новые страницы. Структура сайта представлена на рисунке.

6. Переименование Новых страниц в FrontPage. Переходим в режим папки и с помощью контекстного меню меняем имена Новая страница 1 на info, Новая страница 2 на business, Новая страница 3 на pay.

7. С целью единства дизайна страниц сайта копируем содержание главной страницы в созданные страницы info, business, pay. Для этого открываем главную страницу в режиме Страница и выполняем команду "Правка / Выделить все", и щелкаем на кнопке Копировать на панели инструментов. Переходим в режим Папки и щелкаем дважды на страничке info, она откроется в режиме Страница, затем щелкаем на кнопке Вставить. Содержимое главной страницы скопируется в страницу info, аналогично копируем содержимое главной страницы в остальные две страницы.

8. На каждой страничке сайта создаем ссылки для всех пунктов навигации:

 Главная

 О компании

 Бизнес-обзор проекта

 Способы оплаты

Например, выделяем пункт навигации "Бизнес-обзор проекта" и с помощью контекстного меню открываем окно диалога Добавления гиперссылки, в котором выделяем business.htm и щелкаем ОК. Аналогично создаем гиперссылки для всех пунктов навигации на всех страницах. На рисунке представлен фрагмент окна диалога Добавления гиперссылки.

9. Далее на страницах: "О компании"; "Бизнес-обзор проекта";"Способы оплаты" изменим содержание в некоторых ячейках, т.е. введем новый текст и рисунки, которые были подготовлены заранее для этих страниц.

10. Добавляем и заполняем метатеги (между тегами <head> и </head>) на страницах: "О компани"; "Бизнес-обзор проекта"; "Способы оплаты" в режиме Код. Например, для страницы "О компании" теги заполнены следующим образом: <title>О компании En101 </title> <meta name="keywords" content="EN101 компания Ричард Маккало"> <meta name="description" content="Ричард Маккало - основатель и главный Администратор En101 INC"> <meta NAME="Author" CONTENT="Владимир Ткаченко"> <META content="INDEX, FOLLOW" name=ROBOTS> 11. Переименование заголовков страниц в режиме Переходы. Выделить страницу и с помощью контекстного меню осуществить переименование:

 Новая страница 1 переименовать на "О компании".

 Новая страница 2 переименовать на "Бизнес-обзор проекта".

 Новая страница 3 переименовать на "Способы оплаты". В результате разработки получим сайт, который состоит из четырех веб-страниц. Этот сайт, созданный с помощью FrontPage в файловой системе ПК, можно разместить на веб-сервер в сете Интернет или Интранет.

ехника оформление текста с помощью CSS

CSS (каскадные таблицы стилей) приобрели популярность в конце 1996 года. Не смотря на относительно долгое существование этой технологии, ее практическое применение для Web-дизайна ограничивалось управлением шрифтами и цветом, по крайней мере, до недавнего времени.

Данное ограничение возникло из-за отсутствия совместимой поддержки таблиц стилей браузерами. Поскольку не все браузеры одинаково обрабатывали инструкции языка CSS (если вообще обрабатывали), дизайнеры не могли в полной мере воспользоваться реальными преимуществами таблиц стилей. Вместо этого, ответственность за отображение информации возлагалась на язык HTML.

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

Почему это так важно? Причин тому - множество:

Очевидно, что язык CSS предоставляет множество возможностей.

Каскадные таблицы стилей (CSS) стали невероятно популярными в последние годы, прежде всего, благодаря широко распространенной поддержке браузерами большинства их директив.

Люди часто интересуются, почему стили называются каскадными? Каскад - это иерархия применения - красивое название для системы применения правил. Если внимательно посмотреть на ниже перечисленные типы таблиц стилей, то станут очевидными различные способы применения стиля к одному и тому же документу.

Что же получится в результате, если у нас будет встроенный стиль, внедренная таблица стилей и связанная таблица стилей?

Каскад определяет способ применения правил, в случае с типами таблиц стилей:

Стиль браузера используется только в том случае, когда для данного элемента не было предоставлено ни одного стиля.

Существует шесть типов таблиц стилей:

Каскад также относится к порядку применения нескольких таблиц стилей. Если существуют три связанные таблицы стилей, применена будет та из них, которая интерпретируется браузером при наличии конфликтов между ними.

CSS помогает исключить физическую разметку внешнего вида из HTML или XHTML, добавить дизайну эффекты и визуальную интригу, а также облегчить рабочий процесс дизайнеров.

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

Содержание — это та информация, которую получает пользователь.

Структура — принцип организации этой информации.

Представление — внешний вид, который воспринимает пользователь.

Содержание веб-страницы — это то, что эта страница сообщает пользователю; та информация, которую она передает. Содержание — наиглавнейшая составляющая страницы, то, ради чего эта страница вообще существует.

Этот ресурс посвящен текстовому содержанию сайтов, но вообще содержание может быть не только текстовым. Например, в виртуальной картинной галерее содержанием являются цифровые репродукции картин, а в архиве бесплатно распространяемых программ содержанием могут являться файлы с исходным кодом и установочными комплектами этих программ.

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

Многие разработчики сайтов любят говорить о таких вещах, как «концепция», «стиль», «дизайн», «креатив» и т. д. Конечно, оригинальная концепция и великолепный стиль могут существенно улучшить эффективность сайта и его привлекательность для пользователя — но только при условии, что сайт предоставляет нужное и интересное содержание. В самом деле, первый вопрос, который должен задавать себе разработчик, - «Зачем пользователи будут заходить на мой сайт?» Если вовремя не задуматься над этим — может получиться красивый, но никому не нужный сайт.

Структура страницы — это взаимосвязь ее логических элементов: заголовков, обычного текста, перечней, гиперссылок и т. д. Пользователю удобнее воспринимать содержание, если оно организовано в стройную и логичную структуру. В самом деле, подумайте, как вы пользовались бы словарем, если бы слова в нем шли не по алфавиту, а в случайном порядке? Алфавитный порядок — один из типичных примеров того, как содержанию придается определенная структура. На веб-страницах для структурной организации используются элементы HTML.

Наконец, представление страницы — это та форма, в которой пользователь ее воспринимает. Большинство пользователей просматривают страницы на экранах компьютеров и других устройств. Значит, для них представление страницы — это то же самое, что ее внешний вид, оформление.

Если пользователь прослушивает веб-страницу с помощью речевого браузера или «прощупывает» ее браузером Брайля — значит, представлением является ровно то, что он слышит или нащупывает.

Таблицы стилей CSS как раз и предназначены для описания представления страницы.

Содержание, структура и представление — три разные вещи, но они тесно связаны между собой. Структура и представление страницы должны соответствовать ее содержанию и помогать пользователю воспринимать это содержание. С другой стороны, разумеется, для одного и того же содержания нередко можно придумать несколько различных удачных структур и много разных вариантов представления.

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

Основы CSS

 

Основным понятием CSS является стиль – т. е. набор правил оформления и форматирования, который может быть применен к различным элементам страницы. В стандартном HTML для присвоения какому-либо элементу определенных свойств (таких, как цвет, размер, положение на странице и т. п.) приходилось каждый раз описывать эти свойства, даже если на одной страничке должны располагаться 10 или 110 таких элементов, ничуть не отличающихся один от другого. Вы должны были десять или сто десять раз вставить один и тот же кусок HTML­кода в страничку, увеличивая размер файла и время загрузки на компьютер просматривающего ее пользователя.

CSS действует другим, более удобным и экономичным способом. Для присвоения какому-либо элементу определенных характеристик вы должны один раз описать этот элемент и определить это описание как стиль, а в дальнейшем просто указывать, что элемент, который вы хотите оформить соответствующим образом, должен принять свойства стиля, описанного вами. Удобно, не правда ли?

Более того, вы можете сохранить описание стиля не в тексте вашей странички, а в отдельном файле – это позволит использовать описание стиля на любом количестве Web­страниц. Потрясающе удобно. И еще одно, связанное с этим, преимущество – возможность изменить оформление любого количества страниц, исправив лишь описание стиля в одном (отдельном) файле.

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

Давайте рассмотрим, как мы можем воплотить столь замечательные возможности в жизнь.

Практическое освоение CSS

Как вам уже известно, информация о стилях может располагаться либо в отдельном файле, либо непосредственно в коде Web-странички. Расположение описания стилей в отдельном файле имеет смысл в случае, если вы планируете применять эти стили к большему, чем одна, количеству страниц. Для этого нужно создать обычный текстовый файл, описать с помощью языка CSS необходимые стили, разместить этот файл на Web-сервере, а в коде Web-страниц, которые будут использовать стили из этого файла, нужно будет сделать ссылку на него. Делается это с помощью тега <LINK>, располагающегося внутри тега <BODY> ваших страниц:

<LINK REL=STYLESHEET TYPE="text/css" HREF="URL">

Первые два параметра этого тега являются зарезервированными именами, требующимися для того, чтобы сообщить броузеру, что на этой страничке будет использоваться CSS. Третий параметр – HREF= «URL» – указывает на файл, который содержит описания стилей. Этот параметр должен содержать либо относительный путь к файлу – в случае, если он находится на том же сервере, что и документ, из которого к нему обращаются – или полный URL («http://...») в случае, если файл стилей находится на другом сервере.

Второй вариант, при котором описание стилей располагается в коде Web­странички, внутри тега <BODY>, в теге <STYLE type="text/css">... </STYLE>. В этом случае вы можете использовать эти стили для элементов, располагающихся в пределах странички. Параметр type="text/css" является обязательным и служит для указания броузеру использовать CSS.

И третий вариант, когда описание стиля располагается непосредственно внутри тега элемента, который вы описываете. Это делается с помощью параметра STYLE, используемого при применении CSS с большинством стандартных тегов HTML. Этот метод нежелателен, и понятно почему: он приводит к потере одного из основных преимуществ CSS – возможности отделения информации от описания оформления информации. Впрочем, если необходимо описать лишь один элемент, этот вариант расположения описания стилей также вполне применим.

Давайте рассмотрим механизм, с помощью которого стили присваиваются элементам Web­страниц. Самый простой случай присвоения какому-либо элементу определенного стиля выглядит так:

НАЗВАНИЕ_ЭЛЕМЕНТА {свойство: значение;},

Где НАЗВАНИЕ_ЭЛЕМЕНТА – имя HTML­тега (H1, P, TD, A и т. д.), а параметры в фигурных скобках – список свойств элемента и присвоенных им значений. Более подробно команды языка CSS мы рассмотрим чуть позже.

Пример:

H1 {font-size: 30pt; color: blue;}

В этом примере всем заголовкам на странице, оформленным тегом Н1, присваивается размер шрифта 30 пунктов и синий цвет.

Также элементы страниц, созданные с использованием CSS, используют механизм наследования: т. е. если вы располагаете изображение внутри тега <P>...</P>, оформленного с помощью CSS, с отступами, так, чтобы параграф занимал только определенную часть ширины страницы, изображение также унаследует значения отступов, указанные для этого параграфа.

CSS реализует возможность присваивать стили не всем одинаковым элементам страницы, а избирательно – для этого используется параметр CLASS = "имя класса" или идентификатор ID=«имя элемента», присваивающиеся любому элементу страницы. Рассмотрим эти возможности подробнее.

Параметр CLASS применяется в случае, если необходимо создать одинаковый стиль для нескольких, но не всех элементов страницы (одинаковых или разных).

Пример:

.b-с {font-weight: bold; text-align: center}

– описание стиля для класса b-с

Все элементы класса b-с будут отображаться жирным шрифтом с выравниванием по центру страницы (или ячейки таблицы).

<P CLASS="b-с">Текст параграфа</P>

– параграфу присвоен стиль класса b-с.

<TD CLASS="b-c">текст</TD>

– ячейке таблицы присвоен стиль класса b-c.

Содержащийся в ячейке текст будет отображаться согласно описанию класса.

Таким образом, вы можете присвоить описанный стиль любым текстовым элементам страниц. Обратите внимание, что при написании названия классов необходимо соблюдать регистр символов, согласно тому, как вы назвали класс в описании стиля!

Присвоение стилей с помощью идентификаторов применяется в случае, если данному идентификатору соответствует только один элемент на странице. Если элементов, которым необходимо присвоить такой стиль, несколько – это уже класс.

Свойства элементов, управляемых с помощью CSS

В настоящее время язык CSS насчитывает довольно большое количество свойств элементов HTML, которыми он может управлять. Но из-за того, что этот стандарт еще очень молод, в полном объеме его пока не поддерживают наиболее популярные броузеры (Netscape Navigator и Microsoft Internet Explorer). Последние версии этих броузеров могут работать с довольно большим количеством команд CSS, а вот 3-и версии или совсем не поддерживают его (Netscape Navigator 3), или поддерживают, но лишь частично (Microsoft IE 3). Более того, поскольку разработчики из этих компаний никак не могут договориться между собой, последние версии броузеров поддерживают неодинаковый набор свойств CSS. Все это делает малоприемлемым использование CSS в полном объеме, так как, при использовании CSS для форматирования элементов страницы и просмотре ее с помощью броузера версии ниже 4­й, есть большая вероятность увидеть нечто такое, что вам не понравится. Поэтому будет разумнее воздержаться от использования CSS для форматирования основной структуры страниц до всеобщего перехода на последние версии броузеров. В то же время, применяя «безопасные», т. е. совместимые с максимальным количеством броузеров элементы CSS, вы можете сильно облегчить себе жизнь и сделать ваши Web-странички более привлекательными в плане шрифтового оформления, а пользователи, путешествующие по Internet с помощью устаревших броузеров, просто этого не увидят, но также они не увидят и тех кошмаров, которые появляются при использовании CSS для верстки страниц.

СВОЙСТВА ШРИФТА

font-family

Используется для указания шрифта или шрифтового семейства, которым будет отображаться элемент. P {font-family: Times New Roman, sans-serif;}

font-weight

Определяет степень жирности шрифта с помощью трех параметров: lighter, bold, bolder B {font-weight: bolder;}

font-size

Устанавливает размер шрифта. Параметр может указываться как в относительной (проценты), так и абсолютной величине (пункты, пикселы, сантиметры) H1 {font-size: 200%;} H2 {font-size: 150px;} H3 {font-size: 400pt;}

font-size

Устанавливает размер шрифта. Параметр может указываться как в относительной (проценты), так и абсолютной величине (пункты, пикселы, сантиметры) H1 {font-size: 200%;} H2 {font-size: 150px;} H3 {font-size: 400pt;}

ЦВЕТ ЭЛЕМЕНТА И ЦВЕТ ФОНА

color

Определяет цвет элемента I {color: yellow;}

background-color

Устанавливает цвет фона для элемента – именно для элемента, а не для странички. Обратите внимание, что броузеры отображают это свойство по-разному: Microsoft IE отводит под фон элемента всю доступную ширину страницы, а Netscape Navigator – лишь ширину, занимаемую этим элементом. Посмотрите пример (рис. 3, 4 ), вот его исходный код: <HTML> <HEAD> <TITLE>Пример использования CSS</TITLE> <STYLE type=”text/css”> H1 {font-size: 300%;} </STYLE> </HEAD> <BODY bgcolor=white> <center><BR> <H1 style=”background-color: teal; color: white;”>Cascading</H1> <H1 style=”background-color: navy; color: yellow;”>Style</H1> <H1 style=”background-color: gold; color: brown;”>Sheets</H1> </BODY> </HTML> В этом примере в разделе <STYLE> всем элементам <Н1> на этой страничке был установлен размер 300 % от нормы. Затем каждому из элементов <H1> были присвоены собственные значения цвета фона и цвета символов.

СВОЙСТВА ТЕКСТА

text-decoration

Устанавливает эффекты оформления шрифта, такие, как подчеркивание или зачеркнутый текст H4 {text-decoration: underline;} A {text-decoration: none;} .wrong {text-decoration: line-through;}

text-align

Определяет выравнивание элемента. P {text-align: justify} H1 {text-align: center}

text-indent

Устанавливает отступ первой строки текста. Чаще всего используется для создания параграфов с табулированной первой строкой. P {text-indent: 50pt;}

line-height

Управляет интервалами между строками текста. P {line-height: 50 %}

СВОЙСТВА ГРАНИЦ

margin-left

Устанавливают значения отступов вокруг элемента. IMG { margin-right: 20pt} P { margin-left: 2cm}

margin-right margin-right margin-top

Устанавливают значения отступов вокруг элемента. IMG { margin-right: 20pt} P { margin-left: 2cm}

ЕДИНИЦЫ ИЗМЕРЕНИЯ

px

Пикселы

cm

Сантиметры

mm

Миллиметры

pt

Пункты (типограф.)

%

Проценты

Итак, перейдем к изучению безопасных элементов CSS. Описание свойств элементов в CSS состоит из названия свойства с последующим присвоением ему определенного значения. Название свойства и его значение разделены двоеточием.

Указывая абсолютные, а не относительные размеры шрифтов, вы лишаете людей, просматривающих ваши странички, возможности увеличивать или уменьшать размер шрифтов с помощью специальной кнопочки в броузере в соответствии с разрешением их дисплея и зрением. Шрифты будут отображаться только такого размера, который вы указали при написании странички.

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

Есть еще одна небольшая, но очень полезная хитрость – это способ скрыть от устаревших броузеров описания стилей, располагающихся в теге <STYLE>, внутри раздела<HEAD>. Поскольку броузер был написан несколько лет назад, когда никакого CSS еще и в планах не было, он просто не поймет, что это такое написано внутри <STYLE>…</STYLE>, и выдаст все описания стилей на страничку, как обычный текст. Для того чтобы предотвратить это, необходимо заключить описания стилей в тег комментариев. Делается это очень просто.

<HEAD>

<STYLE type="text/css">

<!--

описания стилей

-- >

</STYLE>

</HEAD>

где

<!-- – тег, открывающий комментарий, а

­­> – закрывающий.

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

Еще один из интересных вариантов применения CSS скрывается за, казалось бы, простой возможностью: вы можете указывать значения отступов вокруг объектов, как отрицательные величины! Это позволяет накладывать один слой текста на другой и получать весьма интересные и привлекательные результаты.

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

Создадим новый html-файл и составим описание стилей для трех объектов:

<HEAD>

<STYLE type="text/css">

BODY {font-family: Verdana; font-size: 70pt; font-weight: bold;}

.z1 { color: silver; margin-top: 100px; margin-left: 70px;}

.z2 {color: navy; margin-top: -118px; margin-left: 68px;}

</STYLE>

</HEAD>

В этом описании мы присвоили <BODY> (впрочем, это мог быть практически любой другой тег) размер, шрифт и начертание – в таком стиле будут отображаться все элементы страницы. Это было сделано лишь ради стремления уменьшить размер файла странички, вместо этого можно было описать эти параметры дважды: для каждого из классов z. Далее мы описываем два стиля, которые отличаются цветом и размером отступов вокруг них: нижний слой описывается стилем z1, а верхний – z2. Используя отрицательные значения отступов и подбирая нужное значение, мы добиваемся того, что верхний слой как бы наползает на предыдущий...

<BODY bgcolor=white>

<DIV class="z1">EC-NET</DIV>

<DIV class="z2">EC-NET</DIV>

</BODY>

Откроем наш любимый Web-редактор Notepad и создадим файл с будущим названием styles.css (название файла может быть любым). Опишем в этом файле стиль параграфа <P>, который будет использоваться на всех страничках нашего сайта:

P {

font-family: Times New Roman, serif;

color: #000000;

margin-left: 15%;

margin-right: 15%;

margin-top: 1pt;

margin-bottom: 1pt;

text-indent: 1cm;

text-align: justify;

}

Внутри описания стиля для удобства форматирования вы можете использовать любое количество пробелов и переносов строк – при чтении стиля броузер просто отбросит все лишние пробелы.

В этом стиле мы задали, что параграфы <P> на всех страничках, которые используют это описание, будут отображаться шрифтом Times New Roman или в случае, если этот шрифт на машине не установлен, другим шрифтом, но из этого семейства (serif). Цвет шрифта мы установили черный, выравнивание – полное (по обеим сторонам).

Также мы установили для параграфа ряд значений отступов. Это было сделано со следующей целью: по умолчанию параграф в HTML отображается равным практически 95 % страницы и с интервалами между параграфами, равными 180 % межстрочного интервала. Читать такие параграфы не очень удобно, так как интервалы между ними слишком велики, а ширина параграфа слишком большая. Посмотрите на журнал, который вы сейчас держите в руках: текст сверстан в колонки для того, чтобы его было удобнее читать. В стиле параграфа, который мы создали, установлены боковые отступы в 15 % ширины окна и вертикальные отступы в 1 пункт – так текст статьи будет гораздо читабельнее.

Давайте так же создадим стиль для заголовков статей:

H2 {

font-family: Verdana, Arial Cyr, Arial;

font-weight: bold;

font-size: 14pt;

color: black;

margin-left: 20%;

margin-top: 1cm;

text-align: left;

}

Все заголовки наших страниц, оформленные тегом <H2>, будут отображаться жирным шрифтом Verdana или, если этот шрифт не установлен, шрифтом Arial. Размер заголовка мы установим равным 14 пунктам, цвет черный, отступ слева равен 20 % ширины страницы, а отступ сверху – 1 см. Заголовок будет выравниваться относительно левого края страницы.

Благодаря тому, что боковые отступы заголовка и параграфа установлены нами в процентах от ширины окна броузера, при просмотре наших страничек на компьютерах с разным разрешением дисплея пропорции и расположение заголовка, основного текста и отступов будут сохранены.

Для того чтобы «привязать» созданные нами стили к нашим страничкам, во все html-файлы в разделе <HEAD> мы должны поместить строку со ссылкой на файл стилей и с указанием об использовании CSS:

<LINK REL=STYLESHEET TYPE="text/css" HREF="styles.css">

Поскольку файл со стилями будет находиться в том же каталоге сервера, что и остальные странички, параметр HREF="URL" в нашем случае будет просто именем нашего файла стилей (styles.css).

24

PDF (аббр. от Portable Document Format) - формат электронных документов, разработанный компанией Adobe Systems. Кроссплатформенность формата создает удобные условия для организации электронного документооборота.

Документ в формате pdf может содержать шрифты, графику, мультимедийные элементы, что гарантирует правильное отображение независимо от операционной системы, программного обеспечения и пользовательских настроек конкретного компьютера. Именно это свойство - сохранять исходный вид и делает его привлекательным.

PDF Creator — это программа для создания документов в формате PDF работающая как виртуальный принтер. Так-как печать файлов поддерживается множеством различных программ, то PDFCreator можно использовать для конвертации многих форматов текстовых и графических файлов. Документы PDF, созданные при помощи программы PDFCreator, можно защитить от нежелательного просмотра и копирования множеством различных способов.

Что еще умеет PDFCreator:

- Возможность создания файлов PDF с любой программы поддерживающей печать.

- Возможность шифрования документов PDF и защиты его от просмотра и печати.

- Возможность отсылки файлов PDF с помощью электронной почты.

- Кроме конвертации в PDF возможно создание файлов в форматах PNG, JPG, TIFF, BMP, PCX, PS и EPS.

- Автоматическое сохранение документов в папки с именами файлов основанными на тегах.

- Простая установка. Просто укажите что вам необходимо и все будет установлено.

- Объединение нескольких файлов в один файл PDF.

- Возможность установки на сервер. Это предоставляет возможность использования одной программы большим количеством пользователей локальной сети.

- PDFCreator бесплатный даже для коммерческого использования. Это программа с открытыми кодами и распространяется на условиях GNU General Public License.

- Многоязычный интерфейс (украинский и русский языки присутствуют).

pdf995

Данная программа, на первый взгляд,совершенно не интересна, так как даже не имеет собственного окна настроек. Вы лишь отправляете документ на печать, используя виртуальный принтер pdf995, после чего получаете готовый PDF. Однако у нее есть две положительные особенности. Во-первых, pdf995 бесплатен. Бесплатных виртуальных принтеров для Windows, на самом деле, не так уж и много. Единственное ограничение, связанное с использованием pdf995, заключается в показе рекламного окна по завершению операции печати. Его удаление обойдется в $9.95, для этого требуется регистрация. Но в самих документах никакая рекламная информация не появляется.

Вторая особенность pdf995 – это корректное отображение кириллицы. Нельзя сказать, что это какое-то чудо и откровение – почти половина программ в данном путеводителе имеют делать то же самое. Однако, вспомнив о бесплатности, мы получаем весьма приятную смесь – простое приложение, умеющее создавать PDF с кириллицей, за которое не нужно платить деньги.

Официальный сайт: www.pdf995.com

Тип лицензии: бесплатная.

PDF2TXT 3.0 Эта небольшая утилита преобразовывает файлы формата pdf (Acrobat Reader) в текстовый формат *.txt. Среди ее возможностей: — Многоязыковая поддержка включая английский, французский, немецкий, итальянский и пр. — Поддержка протокола PDF1.5 (Acrobat 6.0). — Отсутствие необходимости использования Adobe Acrobat. — Пакетное преобразование файлов. — Работа с командной строкой. — Автоматическое выравнивание колонок в таблице и пр. http://www.verypdf.com/pdf2txt/pdf2txt.htm#dl, 600 Кб.

Document2PDF Pilot 1.3 Эта программа позволяет конвертировать файлы из форматов txt, rtf, html, htm, shtml, chm, doc, mcw, xls, xlw, wri, wps, wpt, wpd в pdf. Document2PDF Pilot поддерживает режим защиты pdf-файлов паролем (использует 40-битные и 128-битные ключи шифрования), вставку шрифтов, различные режимы компрессии. Используя групповой режим (batch mode), можно конвертировать несколько файлов одновременно. http://www.colorpilot.com/load/docpdf.exe, 1,8 Мб

PdfGrabber 1.1 PdfGrabber позволяет экспортировать содержимое pdf-файлов в разнообразные форматы — например, в Excel, rtf, Word. Программа позволяет изменять содержимое pdf-файлов в таких приложениях, как Microsoft Word, Microsoft Excel или Access. Причем для ее успешной работы вовсе не обязательно устанавливать Adobe Acrobat. http://www.pixelplanet.de/english/products/pdfgrabber/download . html, 6,1 Мб.

Adobe Reader – это бесплатная программа, позволяющая открывать, просматривать, производить поиск PDF-файлов, а также их цифровую подпись, проверку и печать. На сегодняшний день в мире распространено более 600 миллионов копий Adobe Reader, работающих на 23 платформах и 33 языках.