1 / 36

Úprava textu

Úprava textu. Úvod. Všetky tagy na formátovanie textu sú in-line tagy, to znamená riadkové. Nezalamujú za sebou riadok (narozdiel od blokových tagov). Existujú dva spôsoby formátovania textu: fyzické logické

suchin
Download Presentation

Úprava textu

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Úprava textu

  2. Úvod • Všetky tagy na formátovanie textu sú in-line tagy, to znamená riadkové. Nezalamujú za sebou riadok (narozdiel od blokových tagov). • Existujú dva spôsoby formátovania textu: • fyzické • logické • Fyzické formátovanie hovorí, ako má ktorý text presne vypadať (t.j. ako má byť formátovaný). Nezaujíma sa logickou úlohou formátovaného textu (snáď okrem sup a sub).

  3. Úvod • Logické formátovanie vymedzuje význam elementu. Pritom vôbec nehovorí, ako má vymedzený text vyzerať. • Pôvodne malo mať logické vymedzenie oveľa väčší význam, než aký má v súčasnosti, kde sa používa najmä fyzické formátovanie. Dnes sa logické značky používajú veľmi zriedka, naviac často s fyzickým významom.

  4. Fyzické formátovanie

  5. <b> • Tučný text (z angl. "bold"). • Používa sa veľmi často na zvýraznenie. • Býva často zamieňaný s tagom <strong>, ktorý vyjadruje logické zvýraznenie realizované tučným písmom. • Syntax: • <b>tučné písmo</b>

  6. <i> • Kurzíva (z angl. "italic"). • Býva zamieňaný za <em>, ktorý vyjadruje logické zvýraznenie realizované kurzívou • Syntax: • <i>písmo zobrazené kurzívou</i>

  7. <u> • Podčiarknutie (a angl. "underline"). • Poznámka: • Doporučuje sa nepoužívať. Z dôvodov: • Podčiarknutý text sa pletie s odkazmi • Typograficky nie je podčiarknutie estetické • Syntax: • <u>podčiarknuté písmo</u>

  8. <sub> • Dolný index (z angl. "subscript"). • Pre ďalšie zníženie a zmenšenie je možno tag sub použiť viackrát za sebou. • Syntax: • <sub>písmo zobrazené dolným indexom</sub>

  9. <sup> • Horný index (angl. "superscript"). • Platí pre neho to isté, čo pre <sub>. • Syntax: • <sup> písmo zobrazené horným indexom </sup>

  10. <small> • Zmenšenie písma o jeden stupeň. • Syntax: • <small>zmenšené písmo</small> • Je možné ho použiť viackrát za sebou: <small><small>maličký text</small></small>

  11. <big> • Zväčšenie písma o jeden stupeň. • Je možné ho použiť viackrát za sebou. • Syntax: • <big>zväčšené písmo</big>

  12. <strike> <s> • Preškrtnuté písmo (z angl. striked). • Poznámka: • Doporučuje sa používať skôr tag <strike> než <s>, hoci v špecifikácii jazyka HTML 4.0 sa to doporučuje naopak, teda používať skôr <s>. • Úplne najlepšie je ale texty vôbec neškrtať alebo použiť tag <del>. • Syntax: • <strike>preškrtnuté písmo</strike> • <s>preškrtnuté písmo</s>

  13. <font> • Nastavenie farby, veľkosti a fontu písma. <font color=“farba” size=“veľkosť “ face=“meno fontu“> text</font> Príklad: <font color="red" face="Arial, Helvetica">červené písmo Arialom</font>

  14. <font> • Pri face je možné síce zadávať viacero fontov (pokiaľ nie je prehliadačom identifikovaný prvý názov, ide k ďalšiemu), ale v praxi je vhodné zostať pri fontoch: • Arial (varianty Helvetica, Verdana, Sans-serif), • Times (Serif) a • Courier (Monotype), • pretože je pri nich je istota, že budú na klientskom počítači zobrazené správne. Doporučuje sa i pridávánie "CE" za názov písma (z dôvodu existencie OS Windows 3.11) • Poznámka: • Doporučuje sa tag <font> nepoužívať (je zastaraný). Je možné ho nahradiť tagom <span> s atribútom style s definíciou CSS štýlu. • Príklad: • <span style="color: red; font-family: Arial, Helvetica">červené písmo Arialom</span>

  15. <font size=“ “> • Veľkosť písma sa v HTML nenastavuje v bodoch ako všetky ostatné rozmery, ale v stupňoch. Stupne sú akési imaginárne jednotky vymyslené iba pre potreby HTML. Stupňov písma je sedem. Od najmenšieho stupňa 1, ktorý sa takmer nedá čítať, až po najväčšiu veľkosť 7. Bežné písmo je stupeň číslo 3. • Presné veľkosti písma nie sú konkrétne stanovené. Užívateľ si môže písmo zväčšovať a zmenšovať v prehliadači. • Okrem priameho nastavenia stupňa písma sa môže použiť aj relatívny zápis +-, napr. size="+1" znamená zväčšenie písma o jeden stupeň.

  16. <basefont> • Základný, prednastavený font pre celú stránku. Musí sa deklarovať bezprostredne za tagom <body>. Je to nepárový tag. • Má rovnaké atribúty ako <font>, ale pri veľkosti nie je možné použiť relatívny stupeň. • Poznámka: • Používanie tohto tagu sa nedoporučuje, pretože sa jeho vlastnosti nevzťahujú na tabuľky a niekedy ani na nadpisy. • Syntax: • <basefont color=“meno farby” size=“veľkosť fontu“ face=“meno fontu"> • Príklad: • <body> • <basefont face="arial" color="navy">Tmavomodrý Arial bude na celej stránke.

  17. <blink> • Blikajúce písmo (z angl. blink = blikať, žmurkať). • Podporované iba prehliadačmi typu Netscape, Operou a Mozilla. • Syntax: • <blink>…..</blink>

  18. <nobr> • Zakázanie zalomenia riadku. Text sa jednoducho nezalomí, aj keď by došiel na koniec stránky. • Používa sa najmä v odkazových stĺpcoch a rámoch, aby neboli odkazy rozhodené na dva riadky. • Poznámka: • Existuje aj neštandardný tag <wbr>, ktorý umožňuje zalomenie vovnútri <nobr> a voliteľné zalomenie veľmi dlhých slov. Funguje v IE i v Mozille. • Syntax: • <nobr>nezalomený text</nobr>

  19. <tt> • Teletypový terminál. • Zobrazované strojopisom. • Syntax: • <tt>text ako výpis z terminálu</tt>

  20. <code> • Výpis kódu, napríklad programu. • Prehliadače používajú neproporcionálne písmo (strojopis). • Veľmi zriedka používaný tag. • Syntax: • <code>výpis kódu</code>

  21. Logické štýly písma dopĺňajú fyzické štýly a umožňujú zvýraznenie textu so zvláštnym významom. Spôsob zobrazenia logických štýlov písma je závislý na typu prehliadača.

  22. Logické formátovanie

  23. Logické štýly písma <body> <cite>Citácia</cite></br> <blockquote>Dľhšia citácia</blockquote><br> <code>Zdrojový kód</code></br> <em>Definovaný termín</em></br> <kbd>Text, zadavaný z klávesnice</kbd></br> <samp>Výstup z programu</samp></br> <var>Mená premenných</var></br> <strong>Špeciálne zvýraznenie</strong> </body>

  24. <span> • Logické vymedzenie časti textu, ktorá bude inak formátovaná alebo na ňu bude viazaný skript. Je príbuzný s tagom <div> s tím rozdielom, že <span> je in-line, tzn. nezalamuje pred a po sebe riadok. • Pri tagu span je možné využiť iba všeobecné atribúty • Syntax: • <span>text s samostatným formátovaním</span>

  25. <strong> • Silné zvýraznenie (z angl. strong = silný, mocný). Prehliadače pre neho používajú tučné písmo, preto býva zamieňaný s tagom <b>. • Rozdiel medzi tagom <strong> a <b>: • tagom <b> hovorím, že je niečo tučným písmom • tagom <strong> hovorím, že je niečo dôležité, zvýraznené • Syntax: • <strong>silne zvýraznený text</strong>

  26. <em> • Zvýraznenie (emphasis). Prehliadače ho vykresľujú kurzívou. Jedná sa o najsprávnejší tag pre zvýrazňovanie (ale pre tento účel je len zriedka používaný). • Poznámka • Podobne ako pri tagu <strong>: <i> je kurzíva, <em> je zvýraznenie, ktoré sa náhodou vykresľuje kurzívou. • Syntax: • <em>zvýraznený text</em>

  27. <cite> • Citácia, ktorá na rozdiel od blokové citácie <blockquote> nezalamuje riadok (je in-line). • Jedná sa o nepoužívaný tag zobrazovaný kurzívou. • Niektoré vyhľadávače vraj neindexujú vnútro tohto tagu, pretože sa domnievajú, že ide o externú citáciu. • Syntax: • <cite>text citácie</cite>

  28. <dfn> • Definícia nového výrazu. • Prehliadače ho zobrazujú kurzívou alebo tučnou kurzívou. • Prakticky nepoužívaný tag • Syntax: • <dfn>definícia</dfn>

  29. <kbd> • Vstup z klávesnice zobrazený strojopisom. • Nepoužívaný tag. • Syntax: • <kbd>text vstupu z klávesnice</kbd>

  30. <samp> • "Vzorka", čo znamená výstup programu. • Zobrazované strojopisom. • Syntax: • <samp>text výstupu z programu</samp>

  31. <var> • Premenná. • Zobrazované kurzívou. • Používa sa snáď iba medzi programátormi pre formátovanie zdrojových kódov. • Syntax: • <var>premenná</var>

  32. <abbr> vysvetlenie skratky • Vymedzuje text, ktorý je skrátenou formu dlhšieho slova alebo frázy. • Zaujímavým atribútom je všeobecný atribút title, ktorý by ako hodnotu mal obsahovať význam tejto skratky. • Často sa používa v blogoch. Internet Explorer <abbr> nepodporuje (nerozozná tag). • Syntax: • <abbr title=“vysvetlenie skratky">SKRATKA</abbr> • Príklad: <abbr title="Cascading Style Sheets">CSS</abbr>

  33. <acronym> • Vymedzuje text, ktorý je skratkou prvých písmen každého zo slov určitého mena alebo frázy, napr. IBM – International Business Machines, HTML – HyperText Markup Language. • Internet Explorer tag acronym pozná (na rozdiel od abbr). • Syntax> • <acronym>TEXT ACRONYMU</acronym>

  34. <del> deleted text • Odstránený text. • Prehliadače ho zobrazujú ako preškrtnutý, staré prehliadače ho zobrazia normálne. • Sú prípady, keď sa vyplatí tag del používať -- najmä v spravodajstve pri vyznačení opravy chyby. • Syntax: • <del dátum>odstránený text</del>

  35. <ins> inserted text • Zobrazované podčiarknutím. • Atribút datetime vyjadruje čas, kedy došlo k pridaniu. • Používa sa zriedka, najčastejšie v spravodajstve a v blogoch. • Syntax: • <ins dátum>pridaný text</ins> • Poznámka: • Tagy del a ins nie sú ani blokové, ani in-line. Môžu obsahovať ďalšie blokové tagy, bez toho by zalamovali riadok.

  36. <q> • Citácia (angl. quote = citovať). • Svojou funkciou sa veľmi podobná tagom <cite> a <blockquote>. • Líši sa atribútom cite, ktorý obsahuje zdroj citácie. • Syntax: • <q cite="zdroj citácie">Text citácie</q> • Príklad: • <q cite="http://ks.utc.sk">Katedra spojov je profilovou katedrou pre výchovu vysokoškolsky vzdelaných odborníkov ... </q>

More Related