P005 SLUŽBY POČÍTAČOVÝCH SÍTÍ

Obsah
<html>                                                               
<head>                                                                    
<title>Priklad dokumentu</title>                                    
</head>                                                                   
<body>                                                                    
Tohle ilustruje příklad <i>velmi</i>                                
jednoduchého HTML dokumentu.                                                    
</body>                                                                   
</html>

  • V HTML příkazech (tj. např. <html>) není významná velikost písmen (tj. proč ne <HtmL>).
  • Součástí příkazu může být i atribut. Atribut obsahuje jméno atributu, znak = a hodnotu atributu. Je-li hodnota atributu víceslovní, musí se uzavřít do uvozovek nebo apostrofů. Délka hodnoty je omezena na 1024 znaků.
  • Potřebujeme-li řídicí znaky HTML použít tam, kde řídicí význam mít nemají, zapisujeme:
    NumerickySymbolickySymbol 
    &#034
    &quot;
    		uvozovky 
    &#038
    &amp;
    		ampersnad 
    &#060
    &lt;
    		menší než 
    &#062
    &gt;
    		větší než 
    &#160
    &nbsp;
    		nonbreaking space

  • Poznámky zapisujeme:
    <!-- Tohle je poznámka, která se neobjeví ve výpisu. -->
    Může být i na více řádků. Poznámky nelze vnořovat.




<p>
Začátek odstavce, </p> se nevyžaduje. Násobné <p> se ignorují. Povoluje se atribut align s hodnotami left, center, right.

<br>
Vloží se nový řádek. </br> není. Povoluje se atribut clear s hodnotami left, right a all. Atributem se zruší levá, pravá, obě zarážky, které byly změněny např. vložením obrázku. Příklad: 
<img src="http://www.fi.muni.cz/informatics/fi-logo.gif"
  align=left>
Tento text se umístí vedle obrázku.
<br clear=left>
Pokračuje se pod obrázkem.

<nobr>
Text až po </nobr> se celý umístí na jeden řádek. Používá se např. pro zápis příkladů příkazů.

<wbr>
Uvnitř <nobr> označuje místa, kde je v případě potřeby možné řádek rozdělit.

<pre>
Text až po </pre> zobrazí v neproporcionálním písmu a bez formátování (konec řádku se udělá tam, kde je ve zdroji). Používá se např. pro zápis příkladu programu. Atributem width určujeme délku nejdelšího řádku ve znacích, který se má ještě vejít do okna - použije se pro stanovení velikosti fontu.

<center>
Text až po </center> se umístí do středu řádku. Může být i přes více řádků.

<plaintext>
Zbytek dokumentu se neformátuje. Neexistuje </plaintext>.

<blockquote>
Až po </blockquote> naformátuje text do odstavce odsazeného zleva i zprava.

<h1> až <h6>
Šest úrovní hlaviček (1 je nejvyšší). Musí být odpovídající </h1>. Možný atribut align může nabývat hodnot left (implicitní), center a right.
Podle kontextu:
<cite>
Až po </cite> se použije písmo vhodné pro citace (většinou italika).
<code>
Pro zápis příkazů (typicky strojopisné).
<em>
Skloněné písmo pro definici nových pojmů (většinou italika).
<kbd>
Pro zápis textu psaného na klávesnici (většinou strojopisné).
<samp>
Výpis příkladů (strojopisné).
<strong>
Tučné písmo.
<var>
Pro jména proměnných (italika nebo strojopisné).
Označení konkrétního stylu:
<b>
Tučné písmo až po </b>.
<big>
Větší písmo o jeden stupeň (pouze Netscape).
<blink>
Blikající text.
<i>
Italika.
<small>
Menší font o jeden stupeň.
<strike>
Přeškrtnutí.
<sub>
Subscript (dolní index).
<sup>
Superscript (horní index).
<tt>
Strojopisné písmo.
Styly lze kombinovat, např:
<b><i>Dnes je krásně!</i></b>

Velikost písma:

Netscape a Explorer používají relativní označování velikosti písma: nejmenší je 1 a největší je 7. Implicitní velikost je 3. Změna o jeden stupeň odpovídá změně velikosti písma o 20% (není-li nastaveno jinak).
<basefont>
vyžaduje atribut size, kterým zadáme implicitní velikost písma mezi 1 a 7 (implicitně 3). Často se zadává mezi <head> a </head>. Příkaz </basefont> (nepovinný) vrátí zpět implicitní velikost fontu.

Lze použít i relativní změnu stupně zadáním znaménka (např.\ size=-1).

<font>
má atributy color a size. Velikost se zadává absolutně (v intervalu 1 až 7) nebo relativně (+ nebo -).

Barvy se nastavují buď hexadecimálně RGB, nebo jménem barvy. Zadává se ve tvaru #FFFF00 (tj. mříž a 6 hexa číslic). První dvě číslice určují červenou složku, druhé dvě zelenou a poslední dvě modrou složku barvy. Uvedený příklad je žlutá barva.

Nastavení platí až do </font>.


Hyperlink se definuje příkazem <a> ... </a>. Vše uvnitř je zvýrazněno. Akceptují se tyto atributy:

href
určuje URL, na které hyperlink ukazuje. Pokud uživatel myší vybere zvýrazněný hyperlink, zpřístupní se uvedené URL. URL může být absulutní í relativní.

method
určuje způsob zpracování URL konkrétním prohlížečem (viz později v CGI).

name
Vkládá se identifikátor fragmentu:
<h2><a name="kap3">Kapitola 3. Nové rysy</a></h2>
Na něj se pak odkážeme takto:
<a href="muj_pruvodce.html#kap3">
Nebo v rámci téhož dokumentu pouze:
<a href="#kap3">

rel a rev
formalizovanou formou určují vztah zdrojového k cílovému dokumentu (rel) a vztah cílového ke zdrojovému dokumentu (rev). V rámci jednoho <a> se používají oba atributy. Typicky používané hodnoty atributů jsou:
next
Ukazuje na další dokument v sadě.
prev
Ukazuje na předchozí dokument v sadě.
head
Ukazuje na top-level dokument v sadě.
toc
Ukazuje na obsah sady.
parent
Ukazuje na nadřazený dokument.
child
Ukazuje na podřazený dokument.
index
Ukazuje na index tohoto dokumentu.
glossary
Ukazuje na glosář tohoto dokumentu.
Používá prohlížeč na znázornění typu odkazovaného dokumentu.

title
Hodnota obsahuje titul odkazovaného dokumentu.

<hr>
Oddělí text a vloží vodorovnou čáru. Atributy jsou tyto:
size
Tloušťka čáry v pixelech, implicitně 3.
noshade
Implicitně se čára stínuje tak, aby vypadala jako třídimenzionální. Tímto atributem se vlastnost potlačí. Bez rovnítka a čísla.
width
Délka čáry buď absolutně v pixelech, nebo relativně v procentech (100 % je aktuální šířka okna). Např. <hr width="60%">.
align
má možné hodnoty left, center a right. Má smysl tehdy, pokud je délka čáry menší než 100 %.

<img>
Vkládat do textu lze obrázky ve tvaru GIF (Graphics Interchange Format), JPEG (Joint Photographic Experts Group) a XBM (X BitMap, většinou pod X Window). Před ani za <img> se nevkládá nový řádek, proto jsou obrázky skutečně součástí textu. Atributy se akceptují tyto:

src
je povinným atributem; hodnotou je URL, relativní nebo absolutní cesta k souboru s obrázkem.

alt
Když se nemůže zobrazit obrázek (např. Lynx), pak se vypíše hodnota atributu alt (max 1024 znaků uzavřených do uvozovek).

align
HTML implicitně neurčuje umístění obrázku. Proto je vhodné umístění zadat. Možné hodnoty jsou: top, middle, bottom, left a right.

border
Všechny obrázky, které jsou součásti hyperlinku (<a>), jsou obaleny 2 pixely širokou linkou. Hodnotou lze nastavit novou šířku linky v pixelech (i nulovou).

height a width
Pro stanovení rozměrů obrázků (pro zrychlení vykreslování) nebo nových rozměrů obrázků (pro deformaci obrázku).

hspace a vspace
Pro stanovení vzdálenosti obrázku od ostatního textu. Vše v pixelech.

ismap a usemap
Definuje "citlivé" obrázky. Má smysl pouze u obrázků, které jsou uvnitř hyperlinku (<a>). U takových obrázků umí prohlížeč předávat souřadnice x, y ukazovátka myši (relativně vzhledem k levému hornímu rohu obrázku). Příklad: 
<body>
...
<img src="pics/map.gif" usemap="#map1">
...
<map name="map1">
  <area coords="0,0,49,49" href="link1.html">
  <area coords="50,0,99,49" href="link2.html">
  <area coords="0,50,49,99" href="link3.html">
  <area coords="50,50,99,99" href="link4.html">
</map>

body a atributy pro pozadí
Pozadí dokumentu ovlivňujeme těmito atributy příkazu <body>:
bgcolor
Nastavení barvy pozadí.
background
Hodnotou atributu je URL obrázku, který se vyskládá na pozadí.
bgproperties=fixed
upevní podklad tak, aby se neposouval s obsahem okna.
text
nastavuje barvu textu (popředí).
link, vlink a alink
definují barvu hyperlinků (nevybraného, v minulosti vybraného, právě teď vybraného).



<ul>
(unordered list) Až po </ul> se text formátuje jako seznam s tím, že položky se oddělují <li>. Atributem compact docílíme zhuštěnější podoby seznamu. Atributem type (pouze Netscape) měníme tvar grafické značky oddělující položku na disc, circle a square.

<ol>
(ordered list) Jako <ul> s tím, že se položky očíslují. Lze použít compact. Atributem start zadáme hodnotu čísla první položky (implicitně 1). Atributem type měníme způsob číslování: A (A, B, C, D), a (a, b, c, d), I (I, II, III, IV), i (i, ii, iii, iv), 1 (1, 2, 3, 4).

Seznamy <ul> a <ol> lze vnořovat.

<li>
Oddělovač položek seznamu. Možné atributy jsou type (průběžná změna tvaru oddělovače nebo číslování - viz výše) a value (explicitní určení čísla položky).

<dir>
Určeno pro výpis seznamu souborů (většinou se ale <dir> a <ul> neliší).

<menu>
Seznam typicky krátkých možností/voleb. Odděluje se opět <li>, text však nemůže obsahovat další formátovací příkazy (odstavce, jiné seznamy apod.). Atributy a jiné jako <ul>.

<dl>
(definition list) Vytvoří se seznam, ve kterém se položky oddělují <dt> a <dd>. Povoleným atributem je compact.

<dt>
Nadpis položky (umístí se od začátku řádku, příp. se zvýrazní).

<dd>
Text/obsah položky (oproti nadpisu se odsadí doprava). 

<dl>
  <dt>Krátký nadpis položky
  <dd>Dlouhý text vztahující se k výše uvedenému
      nadpisu.
  <dt>Jiný nadpis.
  <dd>A k němu zase dlouhý popisný text.
</dl>




<table>
Otevírá prostředí pro sazbu tabulky. Uzavírá se </table>. Možné atributy jsou:
align
Implicitně se zarovnává na levý okraj. Možné hodnoty jsou left, right.

border
vytvoří pro tabulku viditelný rámeček. Atribut má nepovinnou hodnotu: tloušťka čáry v pixelech.

hspace a vspace
oddalují tabulku od okolního textu.

width
definuje šířku tabulky buď absolutně v pixelech, nebo relativně v procentech.

Následující příkazy lze zadávat pouze uvnitř prostředí < table>:

<tr>
(table row) zahajuje sazbu řádku tabulky. Řádek se ukončuje </tr>. Atributy:
align
určuje horizontální zarovnání všech buněk na řádku na center, left a right.

valign
určuje vertikální zarovnání všech buněk na řádku na center, baseline (na úroveň horního řádku sousední buňky), top a bottom.

<td>
(table data) popisuje jednu každou buňku tabulky. Konec buňky se označí </td>. Atributy:
width, align a valign
viz <tr>, vztahuje se však pouze na jednu buňku.

colspan
přes kolik sloupců se má buňka vytvořit.

rowspan
přes kolik řádků se má buňka vytvořit.

nowrap
(bez hodnoty) potlačí zalamování řádků.

<th>
(table header) totéž co <td>; některé prohlížeče použijí tučné písmo.

<caption>
pro vymezení popisky tabulky; končí se </caption>. Atributem je align.
<meta>
Předává dodatečné informace o dokumentu. Zadává se v záhlaví dokumentu. Atributy name a content se zadává informační dvojice jméno a obsah. Mají význam tehdy, pokud je umí některý prohlížeč zpracovat.

Atributem http-equiv a content zadáváme informace, které se vloží do MIME hlavičky dokumentu. Např. 

<meta http-equiv="expires" content="31 Dec 99">

<meta http-equiv="content-type" content="text/html; 
    charset=ISO-8859-2">


Následující: Formuláře
Obsah

Michal Brandejs brandejs@informatics.muni.cz