Основы разработки веб сайтов [часть 2]: фотматирование текста
21.04.2008 от
WindOfHeart
Комментарии:
Комментарии пишутся для удобства, в браузере не отображаются.
Комментарии в HTML имеют следующий синтаксис:
<!– это комментарий –>
< !– это тоже комментарий,
он занимает несколько строк –>
Проблемы между открывающим разделителем разметки (”<!”)
и открывающим разделителем комментария (”–”) недопустимы,
но их можно использовать между закрывающим разделителем комментария (”–”)
и закрывающим разделителем разметки (”>”). Распространенной
ошибкой является включение строки символов переноса (”—”)
в комментарий. Следует избегать использования в комментариях двух или
более символов переноса.
Основные теги выделения текста:
<em> или <i> - курсивное выделение
<b> или <strong> -полу жирный текст
<u> подчеркнутый
<s> зачеркнутый
<sub> - под основной строкой, Пример: H2O
<sup> текст над строкой
Тег <HR>
HR - HORIZONTAl RULE (горизонтальная линия), тег закрывать
не нужно.
Пример:
<hr>
Результат:
Как мы видим, линия растянута на ширину страницы и как бы вдавлена
в неё.
Данная линия по длине 159, по высоте 4, выровнена по левому краю. Ее
код:
<hr align=”left” width=”159″ size=”4″ noshade>
Где, align - выравнивание, width - длинна
в пикселях, size высота (также в пикселях), noshade - без тени, т.е.
не вдавлена в страницу.
Выравнивание текста.
Кроме цвета текста, шрифта, размера и начертания можно задать еще несколько
параметров.
Привет всем!
Данный текст выровнен по правому краю, для этого будем использовать
align.
Пример: <p align=”right”> </p>
<p> - абзац, в него заключается обычный текст, припишем к нему
параметр align (выравнивание). В нашем случае это right, в переводе на
русский “право”.
left - лево
right - право
center - по центру.
justify - растянуть по ширине страницы.
E-MAIL ссылка.
Ссылка, как мы помним из предыдущего выпуска задается тегом <a>,
К примеру: Пишите мне -
это E-Mail ссылка, её код:
<a href=”mailto:somemail@somemail.smth?subject=Hello!”>Пишите
мне</a>
Http:// мы заменяем на mailto: (писать куда-то, кому-то), далее
следует E-Mail адрес, через знак вопрос можно указать дополнительные параметры,
к примеру ?subject=Сайт, если пользователь пользуется Е-Маил клиентом,
то при клике на эту ссылку, у него откроется окно, к примеру The Bat, шаблон
нового письма, и в теме уже будет написан текст “Сайт”. Зачем это нужно?
Например, чтобы знать, откуда у не известного вам адресата ваш адрес, в
теме вы увидете
надпись сайт и сразу поймете, что это посититель и пишет вам по поводу
вашего сайта.
Как изменить цвет фона?
Очень просто! Цвет фона задается в теге <BODY>, как мы помним
это тело документа.
Пример: <body bgcolor=”green”>
Задаст цвет фона данной страницы зеленым. bgcolor - сокращение background
color (цвет фона)
Не пишите тег BODY два раза!
Вставка картинок.
К сожалению, рассылка не позволяет отобразиться картинкам, но это не сильно
нам помешает.
Вот картинка, а ниже
её код.<img src=”book_blue.gif” width=”20″ height=”19″>
Рассмотрим подробно: img src - расположение картинки, у меня просто book_blue.gif,
т.к. картинка находится в одной папке с моей страницей. Также можно писать,
к примеру http://mysite.com/logo.gif - это абсолютный путь, т.е. где
бы не была страница, мы бы всегда видели данную картинку. /pictures/logo.gif
- путь относительный, если мы переместим страницу в другую папку, то картинка
отображаться уже не будет. width и height ширина и высота, реально,
задавать их не обязательно, только если вы не хотите изменить размеры картинки.
Как задать вместо цвета фона, картинку?
Также легко!
<body background=”book_blue.gif”>
Списки
Вот пример списка:
- Главная
- Чат
- Гостевая
- Форум
Как мы видим, он маркирован. Код его элементарно прост!
<ul>
< li>Главная</li><li>Чат</li>
<li>Гостевая</li>
<li>Форум</li>
</ul>
Слово, перед которым мы хотим поставить маркер (метку), мы заключаем между
тегами <li>, и не забываем его закрыть: </li>. Список заключается
в теги <ul>
Нумерация также легка!
- Главная
- Чат
- Гостевая
- Форум
Для этого просто заглючим наш маркированный список в теги <ol> </ol>
<ol>
< li>Главная</li>
<li>Чат</li>
<li>Гостевая</li>
<li>Форум</li>
</ol>
- gh
- fth
- f
Еще один список. Как мы видим, маркеры имеют форму квадрата. Все очень
просто. Опять же заключим наш обычный список в теги <ul>, но допишем
параметр type (тип).
<ul type=”square”>
<li>gh</li>
<li>fth</li>
<li>f</li>
</ul>
square - квадрат
circle - закрашенный круг
disc - не закрашенный круг
Благодарю за внимание! Продолжение следует!
Рубрики: HTML, Начинающим |
Оставить комментарий