Struktura XHTML + základní tagy

Struktura XHTML dokumentu má základní rozdělení na dvě části - hlavička dokumentu (head) a tělo (body) dokumentu.

V hlavičce jsou informace o stránce, kódování, odkazy na css styly či titulek. V těle je pak zobrazovaný obsah, který se skládá z několika dílčích částí (nadpisy, odstavce, tabulky a další). Dokument XHTML může mít následující skladbu:

<?xml version='1.0' encoding='utf-8'?>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link href="../Styles/styl.css" rel="stylesheet" type="text/css">
<title>Titulek stránky</title>
</head>
<body>
<h1>Nadpis</h1>
<p>První odstavec</p>
<p>Druhý odstavec...
<ul>
<li>1. položka seznamu</li>
<li>2. položka seznamu</li>
</ul>
<span>...text s odlišnými vlastnostmi</span>
</p>
</body>

Tagy pro EPUB 2

Zde je přehled základních tagů:

Hlavička

<head>

Na začátku každého dokumentu bývají specifikace, které informují o tom, v jakém jazyku je dokument sepsaný, jaké používá kódování a podle jakých pravidel se řídí. běžně jsou první řádky například takovéto:

<?xml version='1.0' encoding='utf-8'?>
<html xmlns="http://www.w3.org/1999/xhtml">

Title

<title>

Tag pro titulek stránky. Pro e-knihy není, narozdíl od webů, nikterak zásadní. Zobrazuje se jen na některých zařízeních.

Linky

<link>

Tento tag definuje vztah mezi dvěma dokumenty. Pro EPUB2 je nejčastější využití připojení externího kaskádového stylu, kde pomocí atributu rel="slylesheet" definujeme, že se jedná o soubor css. Například:

Tělo dokumentu

<body>

Tento tag definuje tělo dokumentu a je tak prarodičem všech vnořených elementů. Mezi tyto značky se píše vše to, co má být zobrazeno.

Oddíly, charaktery

<div><span>

Tyto elemety ohraničují části dokumentu, které je možné následně pomocí css upravit na odlišný vzhled. Zatímco <div> se používá pro vytvoření blokového oddílu (sekce), <span> je element řádkový. Zjednodušeně řečeno to znamená, že <div> před sebou a za sebou udělá konec řádku, <span> se může vyskytovat v jednom řádku a může tak ohraničovat částu s rozdílným stylem.

Oddílů lze na stránce vytvořit libovolný počet a každý může mít jiné vlastnosti.

Odstavce

<p>

Označení pochází z anglického paragraph (odstavec). Text nového odstavce vždy začíná nový řádek a konec odstavce končí řádek. Každý odstavec je automaticky odsazen mezerou, která lze upravit v css.

Nadpisy

<h1>, <h2>,... <h6>

Tag pro vytvoření nadpisů uvedených úrovní. Existuje 6 úrovní nadpisů, kde h1 je největší a h6 je nejmenší.

Tabulky

<table>, <caption>, <tbody>, <tr>, <th>, <td>

Všechny tyto elementy souvisí se zobrazením tabulek. <table> ohraničuje celou tabulku, <caption> se používá pro nadpis tabulky a <tbody> pro tělo tabulky. Další elementy již specifikují řádky a jednotlivé buňky tabulky. <tr> se používá pro vytvoření jednotliveho řádku tabulky. Každý takový řádek pak musí obsahovat minimálně jeden další tag a to buď <th> (buňky záhlaví tabulky), nebo <td> (běžné buňky tabulky). Data se pak zapisují tyto mezi tagy buněk.

Atributy pro slučování buněk - <td>:

colspan - definuje kolik sloupců má buňka přesahovat (sloučené buňky)
rowspan - definuje kolik řádků má buňka přesahovat (sloučené buňky)

Seznamy

<ul>, <ol>, <li>

Seznam je několik oddělených položek. Tyto položky mohou být číslované nebo mohou mít odrážky. Jako ohraničující element pro číslovaný seznam slouží <ol> a pro odrážkový seznam pak <ul>. Element <li> pak tvoří jednotlivé odrážky seznamu.

Pro zadání stylů odrážek se používá atribut type. možnosti jsou následující :

nečíslovaný seznam:

disc - puntík
square - čtvereček
circle - kolečko

číslovaný seznam:

Type odrážek lze použít pro celý seznam nebo i na jednotlivé položky. Správné zobrazení je však závislé na konktrétním zařízení.

Definiční seznamy

<dl>, <dt>, <dd>

Definiční seznam slouží k formátování struktur slovníkového typu. Celý seznam je ohraničen elementem <dl>, jednotlivé definované pojmy jsou zapsané elementy <dt> a jejich definice pak <dd>.

Fyzické formátování

Fyzické formátování se používá pro odlišení části textu. Všechny tyto tagy jsou řádkové a používají se párově.

Přehled tagů pro fyzické formátování

b - tučné písmo (pro cizí termíny, klíčová slova)
strong - tučné písmo (zvýraznění textu)
i - kurzíva (pro cizí termíny, klíčová slova)
em - kurzíva (zvýraznění textu)
u - podtržení textu
sub - dolní index
sup - horní index
small - zmenšení textu
big - zvětšení textu
s - přeškrtnutý text

Obrázky

<img>

Obrázky se do e-knihy pomocí tagu img. obrázků se více věnuji v kapitole Obrázky a grafika.

Povinné atributy obrázků

src - definuje cestu k obrázku
alt - název obrázku

Hypertextové odkazy

<a>

Odkazy mohou být buď na jiné části knihy (relativní) nebo na internetovou stránku či soubor (globální). Odkazy bývají zpravidla zvýrazněny (nejčastěji podtržením).

Povinný atribut

href - cesta k odkazované stránce či souboru

Další elementy

<hr />, <br />

Tag <hr /> vloží vodorovnou čáru a tag <br /> ukončí řádek.

Neviditelná poznámka

<!--

Přímo do zdrojového XHTML dokumentu si lze psát poznmky, které se nebudou při čtení zobrazovat. Taková poznámka začíná zápisem . Například, pokud bude ve zdrojovém kódu níže uvedený zápis, při čtení e-knihy nebude vidět.

Klíčové atributy

Jsou dva atributy, které lze použít téměř u všech tagů XHTML a které jsou klíčové pro provázání se zápisy vlastností:

class (jmeno_tridy)
class (#jmeno)

Elektronické Knihy

Prohledat tento blog