ПоделитьсяTweetПоделитьсяGoogle
Доброго времени суток!
Сегодня займёмся редакцией .
То что можно сделать с обычным текстом в Word, то же cамое можно сделать в html.
Речь пойдёт о том, как можно изменить шрифт и его размер, как сделать текст жирным, подчёркнутым, курсивом, разного цвета и как его выравнивать по центру или краям документа.
Что такое параграф знают все. Текст, выделенный из основной массы строками. Текст разбитый на параграфы легко читать, потому что, как правило, одному параграфу соответствует одна мысль или логическая часть текста.
В HTML также существует разбивка на параграфы и осуществляется тегом
.
У параграфа есть атрибут align — «выравнивание» который в свою очередь имеет своё значение.
Пример:
С помощью параграфа можно расположить текст в нашей страничке по центру:
Привет всем! Здравия и богатства!
По левому краю:
Привет всем! Здравия и богатства!
По правому краю:
Привет всем! Здравия и богатства!
Давайте добавим текст для наглядности сказанного :
Моя первая страничка
Привет всем!
Здравия и богатства! Да будет ваш дом всегда полон счастья, еды и здоровья. Да не коснётся вас горе любое и зависть людская. Да процветают ваши роды и дела ваши! Учитесь добру и других учите. Творите добро вокруг вас и мир станет светлее.
Идём дальше, тег
не может содержать в себе параграфов, то есть параграф в параграфе.
Это не верно. Также не верно писать пустые теги
здесь всегда должен быть текст
ЧИТАТЬ: Как сделать закругленные углы в css
По умолчанию всегда текст выравнивается браузером по левому краю, поэтому атрибут align=»left» для параграфа можно не ставить.
Тег
включает в себе перенос строки.
Тег является альтернативой тега
пишется так:
Привет всем!
Привет всем!
Привет всем!
Вот тоже самое, только компактнее:
Пишем слева
Пишем справа
Данный тег многофункционален он также является пустым блоком-контейнером, который может содержать в себе как текст, так и другие теги.
Есть еще один простой способ выравнивания текста по центру
тег
станет в середине текста
Разберёмся с заголовками
Есть шесть типов заголовков:
Привет всем!
Не смотрите на отображение заголовков с тенями, так только на моём сайте. В CSS стоит правило.
Чтобы выделить часть текста не пользуясь заголовками есть тег — англ. шрифт Тег имеет атрибут size (размер)
Привет всем!
Привет всем!
Привет всем!
Привет всем!
Привет всем!
Надеюсь всё понятно, указали шрифт и его размер и закрыли закрывающим тегом
Цвет в HTML
Немного разберёмся с цветом В html языке используется своя палитра красок. Самые основные цвета:
|
#000000 |
#ffffff |
#ff0000 |
|
#ffa500 |
#ffff00 |
#008000 |
|
#00ffff |
#0000ff |
#800080 |
Таблица цветов здесь.
ЧИТАТЬ: Как сделать галерею на wordpress
Один и тот же цвет можно задать двумя способами:
используя шестнадцатеричное значение цвета RGB — например #ffa500 — оранжевый цвет, либо используя константы цвета — orange
Раскрасим текст, возвращаемся к тегу , он имеет ещё атрибут color — слово пишется на американский манер, так как чисто английский — colour
Почти во всех Сайтах Воронках или Landing Page Заглавие или шапка идёт красным текстом , пример:
Привет всем! — красный. Проэксперементируйте.
Или другим вариантом:
Привет мир!!!
Совет — пишите лучше цвет в RGB , то есть числами, не все браузеры отображают цвет если прописано словом.
Если вы надумаете поменять цвет всего текста, то тег может иметь атрибут text , если указать этому атрибуту цвет, то весь текст станет этим цветом, кроме того который мы указали непосредственно.
Допустим
Весь текст теперь стал зелёным. А атрибут bgcolor указать то это будет цвет фона страницы или тела документа. То есть
и цвет фона поменяется на жёлтый
Моя первая страничка
Здравия и богатства! Да будет ваш дом всегда полон счастья, еды и здоровья. Да не коснётся вас горе любое и зависть людская. Да процветают ваши роды и дела ваши! Учитесь добру и других учите. Творите добро вокруг вас и мир станет светлее.
Если тег имеет 2 атрибута, мы пишем их через пробел в одной строке, как в примере
ЧИТАТЬ: Шаблоны Лендинг Пейдж бесплатно
Стиль текста
Запоминайте новые теги
| — Полужирный текст | |
| — Наклонный текст | |
| — Подчеркнутый текст | |
| — Перечеркнутый | |
| — Перечеркнутый (второй вариант, от первого ничем не отличается) | |
| — моноширинный шрифт | |
| — Малый | |
| — Большой | |
| — Верхний индекс | |
| — Нижний индекс |
Текст между указанными тегами в левой колонке, станет таким как в правой
Шрифт
Для того чтобы указать браузеру каким шрифтом отображать написанное используем тег который имеет атрибут fase (лицо-англ)
Эта строчка будет отображаться шрифтом Arial
Следует указать что браузер отображает указанный стиль пользуясь набором из Вашего компьютера и если Вы указали уж слишком экзотический стиль, которого нет в наборе , то браузер заменит его на существующий .
Предварительно отформатированный текст
В любом браузере текст проходит обработку перед тем как появится, в тексте удаляются переносы и лишние пробелы, пробелы между словами и символами. Пробелов может быть не больше одного.
Делается это для того чтобы текст переносился там где это действительно необходимо, а не там где стояли пробелы, обработка выполняется для разных расширений экрана монитора.
Но это не всегда верно, например для отображения столбцов при написании стихов.
Для этого существует тег
…
текст между этими тегами отображается браузером так как был написан, то есть без изменений.
На сегодня всё про форматирование текста HTML
До следующего урока…
ПоделитьсяTweetПоделитьсяGoogle