1. Тагът font
В html текста се задава с тагa <font>, който има затвяращ таг </font>.
Тагът <font> може да съдържа следните атрибути:
face="название на шрифта" - задава шрифт за текста
size="размер на текста" - задава размер на текста
color="цвят" - задава цвят на текста
Забележки:
1. Шрифта (face) се задава като наименование на съответния шрифт. Най-популярните шрифтове са arial и times new roman, тъй като ги поддържат практически всички браузъри и повечето страници в интернет използват някой от тях като основен шрифт.
Съществуват няколко шрифта, които са близки до arial (например helvetica, verdana, sans-sherif?) и няколко, които са близки до times new roman (например georgia, timoku), затова обикновено се задават заедно няколко близки шрифта, отделени със запетая - в случай, че някои браузъри не поддържат един или повече от тях.
Други популярни шрифтове са
courier, courier new
segoe print, comic sans ms
impact
Тагът <font> може да съдържа следните атрибути:
face="название на шрифта" - задава шрифт за текста
size="размер на текста" - задава размер на текста
color="цвят" - задава цвят на текста
Забележки:
1. Шрифта (face) се задава като наименование на съответния шрифт. Най-популярните шрифтове са arial и times new roman, тъй като ги поддържат практически всички браузъри и повечето страници в интернет използват някой от тях като основен шрифт.
Съществуват няколко шрифта, които са близки до arial (например helvetica, verdana, sans-sherif?) и няколко, които са близки до times new roman (например georgia, timoku), затова обикновено се задават заедно няколко близки шрифта, отделени със запетая - в случай, че някои браузъри не поддържат един или повече от тях.
Други популярни шрифтове са
courier, courier new
segoe print, comic sans ms
impact
Monotype corsiva
2. Размера на буквите на текста се задава
а) Като абсолютна стойност с цифри от 1 до 7 включително, като 1 е най-малкия размер, а 7 - най-големия размер на текста.
б) Като относителна стойност, например -1 или +2 и т.н. В първия случай текста ще се покаже с един размер по-малък от размера на текста по подразбиране (-1), а във втория случай текста ще бъде с размер два пъти по-голям от размера по подразбиране (+2).
3. Цвета се задава чрез английско нaзвание за цвят или чрез 16-ична стойност.
ПРИМЕР:
<font face="arial, helvetica, sans-sherif" size="-1" color="#ff0000">текст</font>
В примера е зададен шрифт arial и сродните му шрифтове, размер на текста с един размер по-малък от размера по подразбиране и цвят на текста червен (#ff0000).
2. Размера на буквите на текста се задава
а) Като абсолютна стойност с цифри от 1 до 7 включително, като 1 е най-малкия размер, а 7 - най-големия размер на текста.
б) Като относителна стойност, например -1 или +2 и т.н. В първия случай текста ще се покаже с един размер по-малък от размера на текста по подразбиране (-1), а във втория случай текста ще бъде с размер два пъти по-голям от размера по подразбиране (+2).
3. Цвета се задава чрез английско нaзвание за цвят или чрез 16-ична стойност.
ПРИМЕР:
<font face="arial, helvetica, sans-sherif" size="-1" color="#ff0000">текст</font>
В примера е зададен шрифт arial и сродните му шрифтове, размер на текста с един размер по-малък от размера по подразбиране и цвят на текста червен (#ff0000).
2. Форматиране на текст
Върху вида на текста може да се въздейства чрез следните тагове:
1. <b> </b> Удебелява текста
2. <i> </i> Показва текста наклонен
3. <u> </u> Подчертава текста (не се поддържа от XHTML)
4. <strong> </strong> Удебелява текста подобно на тага <b>
5. <ins> </ins> Подчертава текста подобно на тага <u>
6. <em> </em> Показва текста наклонен подобно на тага <i>
7. <cite> </cite> Показва текста наклонен подобно на тага <i>
8. <dfn> </dfn> Показва текста наклонен подобно на тага <i>
9. <var> </var> Показва текста наклонен подобно на тага <i>
10. <address> </address> Показва текста наклонен подобно на тага <i>
11. <big> </big> Увеличава големината на шрифта с един размер на всяко изписване на тага
12. <small> </small> Намалява големината на шрифта с един размер на всяко изписване на тага
13. <strike> </strike> Зачертава текста (не се поддържа от XHTML)
14. <s> </s> Зачертава текста (не се поддържа от XHTML)
15. <del> </del> Зачертава текста
16. <sup> </sup> Изписва текста като горен индекс
17. <sub> </sub> Изписва текста като долен индекс
18. <tt> </tt> Изписва текста в шрифт като на пишеща машина подобен на Courier
19. <code> </code> Изписва текста в шрифт като на пишеща машина подобен на Courier
20. <samp> </samp> Изписва текста в шрифт като на пишеща машина подобен на Courier
21. <kbd> </kbd> Изписва текста в шрифт като на пишеща машина подобен на Courier
22. <abbr> </abbr> Таг за изписване на абревиатури(Абревиатура (на латински: ab — „на“, brevis — „кратко“) е дума, която се образува от началните букви или срички на сложни наименования. При абревиатурите краесловията на думите се съкращават и не се поставят точки.Пример СССР (Съюз на съветските социалистически републики) DDR-Deutsche Demokratische Republik). Възпроизвежда се от аудио-браузърите, където задава изговаряне на всяка буква поотделно. Може да съдържат атрибута title, на който се задава като стойност пълното название на съкращението, например <аbbr title="Bulgaria">BG</abbr>
23. <bdo dir="rtl"> </bdo> Ако на атрибута dir на тага bdo e зададена стойност rtl - както е в примера, текста изписан между началния и крайния таг ще се покаже огледално обърнат. Другата възможна стойност на dir е ltr - в този случай текста се показва както е написан.
1. <b> </b> Удебелява текста
2. <i> </i> Показва текста наклонен
3. <u> </u> Подчертава текста (не се поддържа от XHTML)
4. <strong> </strong> Удебелява текста подобно на тага <b>
5. <ins> </ins> Подчертава текста подобно на тага <u>
6. <em> </em> Показва текста наклонен подобно на тага <i>
7. <cite> </cite> Показва текста наклонен подобно на тага <i>
8. <dfn> </dfn> Показва текста наклонен подобно на тага <i>
9. <var> </var> Показва текста наклонен подобно на тага <i>
10. <address> </address> Показва текста наклонен подобно на тага <i>
11. <big> </big> Увеличава големината на шрифта с един размер на всяко изписване на тага
12. <small> </small> Намалява големината на шрифта с един размер на всяко изписване на тага
13. <strike> </strike> Зачертава текста (не се поддържа от XHTML)
14. <s> </s> Зачертава текста (не се поддържа от XHTML)
15. <del> </del> Зачертава текста
16. <sup> </sup> Изписва текста като горен индекс
17. <sub> </sub> Изписва текста като долен индекс
18. <tt> </tt> Изписва текста в шрифт като на пишеща машина подобен на Courier
19. <code> </code> Изписва текста в шрифт като на пишеща машина подобен на Courier
20. <samp> </samp> Изписва текста в шрифт като на пишеща машина подобен на Courier
21. <kbd> </kbd> Изписва текста в шрифт като на пишеща машина подобен на Courier
22. <abbr> </abbr> Таг за изписване на абревиатури(Абревиатура (на латински: ab — „на“, brevis — „кратко“) е дума, която се образува от началните букви или срички на сложни наименования. При абревиатурите краесловията на думите се съкращават и не се поставят точки.Пример СССР (Съюз на съветските социалистически републики) DDR-Deutsche Demokratische Republik). Възпроизвежда се от аудио-браузърите, където задава изговаряне на всяка буква поотделно. Може да съдържат атрибута title, на който се задава като стойност пълното название на съкращението, например <аbbr title="Bulgaria">BG</abbr>
23. <bdo dir="rtl"> </bdo> Ако на атрибута dir на тага bdo e зададена стойност rtl - както е в примера, текста изписан между началния и крайния таг ще се покаже огледално обърнат. Другата възможна стойност на dir е ltr - в този случай текста се показва както е написан.
Пример; <bdo dir="rtl">Васил </bdo>
Излиза: лисаВ
3. Разположение и подравняване на текст
Върху разположението и подравняването на текст (и някои други елементи, например графики и пр.) в html страницата може да се въздейства чрез следните тагове:
1. <br /> Пренася текста на следващия ред. Няма затварящ таг. Може да се използва за оставяне на един, два и т.н. празни реда, като се изпишат толкова на брой тагове <br /> колкото празни редове трябва да се оставят.
2. <p> </p> Оставя разстояние от един ред между горната и долната част на текстов блок и останалия текст. Може да се използва с атрибута align, чиито стойности могат да бъдат:
<p align="left"> Подравнява текста вляво (това е подравняването и по подразбиране)
<p align="right"> Подравнява текста вдясно
<p align="justify"> Подравнява текста едновременно и вляво и вдясно
<p align="center"> Центрира текста
3. <blockquote> </blockquote> Показва текстов блок с отстъп и оставя разстояние от един ред между горната и долната част на текстов блок и останалия текст. Примерно ако пишем някакъв цитат в текст.
4. <pre> </pre> Показва текста така както е написан в текстовия редактор - с всички паузи между букви и думи и оставени празни редове
5. <xmp> </xmp> Ако се изпише html-код между <xmp> и </xmp> той ще се покаже в браузъра така както е написан в текстовия редактор - с ъгловите скоби на таговете, с паузите между букви и думи и с оставените празни редове (не се поддържа от XHTML)
6. <nobr> </nobr> Не позволява разкъсване на текста и пренасяне на думи на по-долен ред - показва текста на един ред
7. <div align="стойност"> </div> Подравнява текста според зададената стойност на атрибута align:
<div align="left"> Подравнява текст и други елементи вляво
<div align="right"> Подравнява текст и други елементи вдясно
<div align="justify">Подравнява текста едновременно и към лявата и към дясната част на страницата
<div align="center"> Центрира текст и други елементи
8. <center> </center> Центрира текст и други елементи (не се поддържа от XHTML)
9. Отмества първия ред на абзац
1. <br /> Пренася текста на следващия ред. Няма затварящ таг. Може да се използва за оставяне на един, два и т.н. празни реда, като се изпишат толкова на брой тагове <br /> колкото празни редове трябва да се оставят.
2. <p> </p> Оставя разстояние от един ред между горната и долната част на текстов блок и останалия текст. Може да се използва с атрибута align, чиито стойности могат да бъдат:
<p align="left"> Подравнява текста вляво (това е подравняването и по подразбиране)
<p align="right"> Подравнява текста вдясно
<p align="justify"> Подравнява текста едновременно и вляво и вдясно
<p align="center"> Центрира текста
3. <blockquote> </blockquote> Показва текстов блок с отстъп и оставя разстояние от един ред между горната и долната част на текстов блок и останалия текст. Примерно ако пишем някакъв цитат в текст.
4. <pre> </pre> Показва текста така както е написан в текстовия редактор - с всички паузи между букви и думи и оставени празни редове
5. <xmp> </xmp> Ако се изпише html-код между <xmp> и </xmp> той ще се покаже в браузъра така както е написан в текстовия редактор - с ъгловите скоби на таговете, с паузите между букви и думи и с оставените празни редове (не се поддържа от XHTML)
6. <nobr> </nobr> Не позволява разкъсване на текста и пренасяне на думи на по-долен ред - показва текста на един ред
7. <div align="стойност"> </div> Подравнява текста според зададената стойност на атрибута align:
<div align="left"> Подравнява текст и други елементи вляво
<div align="right"> Подравнява текст и други елементи вдясно
<div align="justify">Подравнява текста едновременно и към лявата и към дясната част на страницата
<div align="center"> Центрира текст и други елементи
8. <center> </center> Центрира текст и други елементи (не се поддържа от XHTML)
9. Отмества първия ред на абзац
<p> текст текст текст текст текст</p>
!ВНИМАНИЕ: Атрибута align на тага <div> е изваден от стандартите на езика и не се поддържа от XHTML, макар че браузърите ще продължат да го поддържат.
При изписване само на тага <div> без атрибути и стойности ефекта обикновено е като от тага <br />, т.е. преминаване на по-долен ред.
4. Заглавия на текст
Началния таг за задаване на заглавие е <h>, затварящия таг е </h>. Размерът на заглавията се определя с цифрите от 1 до 6 включително, като най-малък е размера на заглавие 6, а най-голям - размера на заглавие 1.
<h1>Заглавие</h1> Най-голям размер на текста
<h2>Заглавие</h2>
<h3>Заглавие</h3>
<h4>Заглавие</h4>
<h5>Заглавие</h5>
<h6>Заглавие</h6> Най-малък размер на текста
При използването на този таг автоматично се добавя по един празен ред над и под текста на заглавието.
В тага <h> може да се включи атрибута align чрез стойностите на който да се укаже подравняване на заглавието вляво (left), вдясно (right) или в центъра (center), например:
<h2 align="center">Заглавие</h2> и т.н.
<h1>Заглавие</h1> Най-голям размер на текста
<h2>Заглавие</h2>
<h3>Заглавие</h3>
<h4>Заглавие</h4>
<h5>Заглавие</h5>
<h6>Заглавие</h6> Най-малък размер на текста
При използването на този таг автоматично се добавя по един празен ред над и под текста на заглавието.
В тага <h> може да се включи атрибута align чрез стойностите на който да се укаже подравняване на заглавието вляво (left), вдясно (right) или в центъра (center), например:
<h2 align="center">Заглавие</h2> и т.н.
За да се изобрази текст на кирилица. Слага се в<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
5. Движещ се текст1. Преминаващ текст
Един много популярен модел, който позволява да поставите ефектен акцент върху желана от вас информация в сайта си или просто да спестите място. Анимираният текст се появява отляво или отдясно (според указаното от нас в direction="...") и преминава по ширина през страницата или елемента, в който е поставен кода, отново и отново.
<marquee direction=”left”> ПРИЯТЕН ДЕН!</ marquee >
2. Появяващ се текст
Анимираният текст, след като се появи на екрана да спре. Това е появяващ се отляво текст, който достигайки границата на елемента, в който е поставен, спира и остава там (за да видим отново ефекта, трябва да презаредим страницата).
<marquee behavior=”slide” direction=”right”> ПРИЯТЕН ДЕН!</marquee >
3. Отскачащ от границите на сайта текст
Анимираният текст се движи само между двата края (ляв и десен) на страницата.
<marquee behavior="alternate" bgcolor="#FF9900">Блъскащ се текст в ляво и дясно </marquee>
<marquee behavior=”alternate”> ПРИЯТЕН ДЕН!</marquee>
4. Вертикално движещ се текст
Движението на текста може да бъде не само хоризонтално, но и вертикално, като ние свободно можем да определим и границите на неговото движение.
<marquee behavior=”scroll” direction=”up”> ПРИЯТЕН ДЕН!</marquee>
<marquee behavior=”scroll” direction=”under”> ПРИЯТЕН ДЕН!</marquee>
<marquee behavior=”scroll” direction=”down”> ПРИЯТЕН ДЕН!</marquee>
6. Скорост на движение
Атрибутът, който отговаря за това с каква скорост ще се движи текста, е scrollamount="...", чиято стойност по подразбиране е "6". С негова помощ вече придобивате пълен контрол над движещия се в сайта текст.
<marquee direction=”left” scrollamount="9" > ПРИЯТЕН ДЕН!</marquee>
7. Подвижен текст с фон
<marquee bgcolor="#FF9900">Подвижен текст с Фон</marquee>
Скороста на движение, на текста можете да променим чрез scrollamount="3"
Можете да променим и фона в желаният цвят, като сменим кода #FF9900
Можете да променим и фона в желаният цвят, като сменим кода #FF9900
<marquee behavior="alternate" scrollamount="3" direction="left" bgcolor="#FF9900"> Блъскащ се текст с променена скорост </marquee>
9. Tекст, който спира, когато мишката е върху него и тръгва когато я махнем
<marquee direction="left" scrollamount="3" onmouseover="this.stop()" onmouseout="this.start()" align="center" width="100" height="100" >Тук пишем нещо</marquee>
-"left" посоката в която да се движе
-width="100" height="100" големината
-scrollamount="3" определя скоростта
