25. září 2011 12:15

4. díl - Formátování textu

Již umíme psát odstavce a nadpisy, zalamovat je a zarovnávat v nich text. Dnes si ukážeme formátování textu jako velikost a styl písma, tučnost, kurzívu apod.

Řádkové značky

V minulém díle jsme používali blokové značky pro odstavce a nadpisy. Blokové značky mají pro sebe vyhrazený celý řádek (nebo více řádků). Když dáte cokoliv před, nebo za ně, bude to na jiném řádku. Dnes si ukážeme řádkové značky. Ty nemají pro sebe vyhrazený řádek, tudíž mohou být uvnitř blokových značek a mohou obsahovat další řádkové značky:

<p><značka1><značka2>nějaký text</značka2></značka1></p>

Musíte dávat pozor, aby se značky nekřížily:

<p><značka1><značka2>nějaký text</značka1></značka2></p>

V prohlížeči se vám křížení značek většinou zobrazí správně, ale je to špatný zápis, takže si na něj nezvykejte.

Formátovací značky

Značka Účel
<b> tučný text
<i> kurzíva
<u> podtržený text
<s> přeškrtnutý text
<sub> textdolní index
<sup> texthorní index

V této tabulce můžete vidět pár nejčastěji používáných formátovacích značek. Všechny tyto značky jsou párové (musejí obsahovat počáteční i koncovou značku). Nedoporučuji používat značku <u>, protože si ji může návštěvník vašeho webu splést s odkazem. Pro lepší pochopení těchto značek si zkuste následující HTML kód:

<h1><i>Ukázka formátovacíh značek</i></h1>
<p>Dnes je <b>oblačno</b>. Na podzim je <i>babí léto</i>.</p>
<p>2 + 5 = <u>7</u> <b><i>Správně</i></b></p>
<p>2<sup>3</sup> = <s>6</s> <b><i>Špatně</i></b></p>
<p>Chemický vzorec vody je <b>H<sub>2</sub>O</b>.</p>

Zvýraznění pro vyhledávače

Existuje také značka <strong> pro tučný text a značka <em> pro kurzívu. Pokud použijete tyto značky, tak se vám v prohlížeči zobrazí úplně stejně jako klasické značky <b> a <i>. Jiné jsou v tom, že text v těchto značkách bere vyhledávač za důležitější, než okolní text.

Značka <font>

Místo této značky se dnes doporučuje používat CSS. Vy ale ještě CSS neumíte, takže si tuto značku ukážeme. Pomocí této párové značky můžete nastavovat velikost a styl písma prostřednictvím vlastností. Pokud napíšete holou značku <font>, tak se na textu nic nezmění.

Styl písma

Styl písma se nastavuje vlastností face. Například písmo Comis Sans MS si nastavíte takto:

<font face="Comic Sans MS">text</font>

Návštěvníkovi vašeho webu se zobrazí tento text v písmu Comic Sans MS, ale to pouze v případě, že má tento styl písma v počítači. Pokud nemá, zobrazí se mu ve výchozím písmu prohlížeče.

Do vlastnosti face můžete přidat další záložní styly písma oddělené čárkou:

<font face="Comic Sans MS, Courier New">text</font>

Pokud návštěvník nemá v počítači písmo Comic Sans MS, zobrazí se mu text v Courier New. Pokud nemá ani tento, tak se mu zobrazí ve výchozím stylu písma prohlížeče.

Velikost textu

Velikost se nastavuje vlastností size. Můžete ji nastavit číslem od 1 do 7. Například velikost 3:

<font size="3">text</font>

Dále můžete text zvětšit nebo zmenšit:

<font size="-2">zmenšený text</font>
<font size="+3">zvětšený text</font>
Kombinování

Nemusíte psát zvláštní značku pro styl písma a zvláštní značku pro velikost textu. Značce <font> můžete nastavit vlastnost face i vlastnost size:

<font face="Arial" size="5">text</font>

Co nás čeká příště

Dnes jste se naučili formátovat text, příště se naučíme barvy.

Hodnocení

Celkové hodnocení
9 hlasů
Vaše hodnocení
Vyberte počet hvězdiček

Komentáře

Jméno:
Předmět:
Komentář:
  :):-|:P:D;):(8)[evil][arrow][idea][?][!]
Kontrola:

21.10.2014 16:12:31 Hodí se!

Určitě se hodí, jak mě, tak  všem ostatním.

Shakal_
0
0

25.9.2011 19:44:59 HTML VS PHP

Ahoj.

Nebylo by lepší nedělat seriál HTML, ale dávat nějaké programovací výtvory, například v PHP?
Podle mě je zbytečné dělat návod na HTML, neboť návodů jsou stovky a jsou mnohem podrobnější. Navíc HTML je i velmi jednoduché, jde prakticky jen o pár značek.
V PHP zas tak moc návodů není a když už, tak v angličtině. Myslím, že by to pomohlo více lidem, protože co občas koukám, tak scripty jsou špatně sestavené a zbytečně složité nebo mají snadno prolomitelnou ochranu. :)

Magnus
3
0
© 2011 - 2024 SuperMartas a Tomáš Hypeš