↑ Вернуться > Основы HTML

Форматирование текста Web -страницы

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

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

Добавление заголовка

Основные элементы HTML.   Теперь , перед тем как приступать к созданию собственных Web- страниц, давайте рассмотрим основные элементы HTML. Дескрипторы — являются одним из основных элементов языка HTML. Именно дескрипторы сообщают Web браузеру информацию о структуре и особенностях форматирования Web страницы. Большенство дескрипторов являются парными, т.е. состоят из открывающей и закрывающей частей и воздействуют на …

Смотреть страницу »

Создание абзацев в тексте.

Создание абзацев в тексте.   Рассмотрим , как разбить целые блоки текста на отдельные абзацы. Чтобы указать начало нового абзаца, необходимо использовать дескриптор простого абзаца <p>. Тег <p> позволяет разбить текст на отдельные абзацы. <p align=»center»>Выравнивание по центру </p> <p align=»left»> Выравнивание по левому краю </p> <p align=»right»>Выравнивание по правому краю </p> <p align=»justify»>Выравнивание по ширине</p> …

Смотреть страницу »

Добавление новой строки.

   Дескрипторы <p> и </p> разделяют текст на абзацы, причем, прижимают строки абзаца к левому краю страницы и добавляют пустые строки. Однако в некоторых случаях требуется, чтобы каждая последующая строка текста находилась сразу под предыдущей. Для того чтобы уведомить Web браузер о том, что нужно перейти к новой строке, используют дескриптор обрыва строки <br>.Дескриптор <br> …

Смотреть страницу »

Форматирование символов.

  HTML-язык разметки. Следовательно, важно уметь форматировать отдельные символы, а также целые фрагменты текста.Такими символами, являются знаки меньше (<) и больше (>), так как с помощью этих символов описываются HTML — теги.   <  &lt знак меньше (<) > &gt знак больше (>)    &nbsp; пробел " &quot; кавычка («) © &copy; знак авторских прав ® …

Смотреть страницу »

Выделение текста.

Тег <b> отображает текст полужирным шрифтом: Полужирный шрифт Вместо тега <b> лучше использовать тег логического форматирования <strong> : Полужирный шрифт Тег <i> отображает текст курсивом: Текст курсивом Вместо тега <i> лучше использовать тег логического форматирования <em> : Текст курсивом Тег <u> отображает текст подчеркнутым: Текст подчеркнутый Тег <strike> и <s> отображает текст перечеркнутым: Текст перечеркнутый …

Смотреть страницу »

Выравнивание абзацев.

  Благодаря атрибуту align (align=»left, right, center, justify»), любые абзацы могут быть выровнены по одному из трех вариантов: — влево — вправо — по центру — по ширине.     Рассмотри на примере наш старый текст, где абзацы выравнены по левому краю, но мы изменим их и пропишем новый код.   <!DOCTYPE> <!—Объявление формата документа— > <html> …

Смотреть страницу »

Создание верхних и нижних индексов

Тег <sub> сдвигает текст ниже уровня строки и уменьшает размер шрифта. Он используется для создания нижних индексов, например H 2O Формула воды H <sub> 2 </sub> O Тег <sup>  сдвигает текст выше уровня строки и уменьшает размер шрифта. Этот тег используется чаще всего для создания степеней, например м2 Единица измерения площади — м <sup> 2 …

Смотреть страницу »

Вывод текста заданным шрифтом

Многофункциональный дескриптор <font> позволяет управлять типом гарнитуры, размером и цветом текста, отображаемым Web браузером.  Данный дескриптор всегда парный <font>и </font>. Изменение типа шрифта: Чтобы задать или изменить тип шрифта, используют атрибут <face> дескриптора <font> <font face=»Times New Roman»> Озера и реки</font> Контроль размера шрифта: Для контроля размера шрифта в тексте используют атрибут <size> дескриптора  <font> <font …

Смотреть страницу »

Изменение цвета шрифта на измененном фоне страницы

  Свойство background — color атрибута style представляет возможность указания цвета фона Web-страницы. Так же как, и цвет текста, цвет фона задается либо наименованием требуемого цвета, либо кодом цвета. Дискрепторы раздела <div> </div> указывают, что данный выбранный цвет фона окрасит не всю Web — страницу, а только ту ее часть , на которой находится текст, …

Смотреть страницу »

Уменьшить отступы между строками

  Чтобы изменить промежутки между строками текста,используют свойство line-height атрибута style, обязательно указывая величину этого расстояния (например,1-одинарный интервал, 1,5 -полуторный, 2-двойной и т.д.) <p style=»line-height:2″> Вкусная еда и приятное застолье -одно из главных удовольствий в жизни. Ведь еда— это то, что едят, чем питаются — это любое вещество, пригодное для еды и питья живого организма. …

Смотреть страницу »

Создание окна для текста

  Чтобы выделить, наиболее важную часть информации, можно разместить ее в своеобразном окне на Web странице. Окно может иметь заливку любого цвета. Чтобы создать такое окно, надо численно определить область Web страницы, которую оно будит занимать. Для этого используют свойства width (ширина) и  height (высота) атрибута  style. Значение этих свойств указывают задаваемые размеры для высоты …

Смотреть страницу »

Перевод строки

Для разделения строк используется одинарный тег Если в HTML — документе набирать текст Строка 1 Строка 2 Строка 3 то Web браузер отобразит его в одну строку : «Строка 1  Строка 2 Строка 3». Для того чтобы строки распологались друг под другом, необходимо добавить тег <br>   в конец каждой строки: Строка 1 <br> Строка 2 …

Смотреть страницу »

Создание границ. Создание двух окон с текстом и с цветным фоном.

Чтобы создать рамку вокруг какого -то элемента (например, заключить текстовый абзац в цветную рамку), можно использовать атрибуты style. Свойства границ, задаваемые атрибутом style.   Свойство границ Описание Значение свойства border-style Задает стиль линии границ Дополняется значениями none(нет границ), solid (узкая сплошная линия) и double (двойная линия). border-color Задает цвет границ элемента Для значений используются названия …

Смотреть страницу »

Создание объекта бегущей строки

Чтобы оживить Web сайт, применим к тексту эффект движения. Движущийся текст не останется незамеченным, поэтому он незаменимый для «горячих» объявлений и рекламных сообщений. Дескриптор <marquee> позволяет создать объект бегущей строки. Дескриптор <marquee> имеет такие допустимые атрибуты. Свадеб Love-story Бухгалтерский учёт Основы питания Основы здоровой пищи. behavior определяет «поведение» строки текста в процессе её движения по …

Смотреть страницу »

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *