Rozdíly

Zde můžete vidět rozdíly mezi vybranou verzí a aktuální verzí dané stránky.

--- spse:pm3:html-uvod [2020/09/22 19:49] – vytvořeno jenda
+++ spse:pm3:html-uvod [2024/07/07 16:48] (aktuální) – upraveno mimo DokuWiki 127.0.0.1
@@ Řádek 7: / Řádek 7: @@
   * Obsahuje běžný text, který je doplněn tagy.
   * Tagy = značky (výrazy) jazyka HTML.
   * HTML soubor lze vytvořit v obyčejném textovém editoru, který ukládá neformátovaný text, např. v poznámkovém bloku.
   * Aby se vytvořený soubor otevíral v Internetovém prohlížeči, musí mít příponu htm či html.
@@ Řádek 23: / Řádek 21: @@
   * Párové
-    * Např.: ''<b>'' je začátek tučného textu, </b> je konec tučného textu.
+    * Např.: **<b>** je začátek tučného textu, **</b>** je konec tučného textu.
     * První tag něco začíná a druhý to končí.
     * Lomítko znamená, že jde o uzavírací tag.
   * Nepárové
-    * Např.: <img> je tag pro vložení obrázku.
+    * Např.: **<img>** je tag pro vložení obrázku.
     * Jsou méně časté.
 ====Ukázka párového tagu ====
-<p>
+<code html>
+<p>            text         </p>
+ ^               ^            ^
+ |               |            |
+začátek tagu   text    konec tagu
-začátek tagu
+</code>
-text
-</p>
-text
-konec tagu
 ====Ukázka nepárového tagu ====
@@ Řádek 52: / Řádek 46: @@
 ====Párové tagy – další příklady ====
-<html>; </html>
+  * <code html>
-<head>; </head>
+<html> </html>
+<head> </head>
+</code>
-<html> je začátek html souboru
+  * %%<html>%%  je začátek html souboru
-</html> je konec html souboru
+  * %%</html>%% je konec html souboru
-<head> je začátek hlavičky
+  * <head>  je začátek hlavičky
-</head> je její konec
+  * </head> je její konec
-<body>; </body>
+  * <code html> <body>; </body> </code>
-<body> je začátek těla stránky
+  * <body> je začátek těla stránky
-</body> je konec těla stránky
+  * </body> je konec těla stránky
 ====Nepárové tagy – další příklady ====
-<img> je tag pro obrázek
+  * **<img>** je tag pro obrázek ale nic jako </img> neexistuje
-ale nic jako </img> neexistuje
+  * ** <br>**  je tag pro řádkový zlom ale nic jako </br> neexistuje
-<br> je tag pro řádkový zlom
- ale nic jako </br> neexistuje
 =====Struktura www stránky =====
@@ Řádek 84: / Řádek 77: @@
 ===Doctype – ukázka ===
 <code html>
-<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
+<!DOCTYPE html>
-Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 </code>
+[[https://www.w3.org/QA/2002/04/valid-dtd-list.html|Starší verze HTML]]
 <----
 ====Head ====
-Hlavička je uzavřena do tagů
+  * Hlavička je uzavřena do tagů
-<head>... </head>
+  * <code html><head>... </head> </code>
   * Je v ní spousta užitečných informací.
   * Žádná z nich se ale nezobrazí přímo ve výsledné stránce
@@ Řádek 97: / Řádek 90: @@
 ---->
-Obsahuje zpravidla dvě základní informace:
+Hlavička obsahuje zpravidla dvě základní informace:
-Název stránky. Je vložen mezi tagy:
+  * Název stránky. Je vložen mezi tagy:
-<title>...</title>
+  * <code html><title>...</title></code>
-Název stránky se zobrazí v horní liště prohlížeče.
+  * Název stránky se zobrazí v horní liště prohlížeče.
-Informace o kódování. Ta je uvozena tagem:
+  * Informace o kódování. Ta je uvozena tagem:
-<meta ..../>
+  * <code html><meta ..../></code>
 <----
 ---->
 ===Head - ukázka ===
+<code html>
 <head>
 <title>Toto je moje stránka</title>
-<meta http-equiv="Content-Type"
+<meta http-equiv="Content-Type" content="text/html; charset=utf8"/>
-content="text/html; charset=windows-1250"
+<meta name="description" content="Něco o mně - moje stránky" />
-/>
+</head>
-<meta name="description" content="Něco
+</code>
-o mně - moje stránky" /> </head>
 <----
 ====Body ====
   * Tady je konečně všechno to, co se na naší stránce zobrazí.
   * Tělo je vloženo mezi párové tagy:
-<body>...</body>
+  * <code html><body>...</body></code>
 =====Ukázka HTML kódu www stránky =====
 <code html>
-<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
+<!DOCTYPE html>
-"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 <html>
 <head>
-<meta http-equiv="Content-Type" content="text/html;
+<meta http-equiv="Content-Type" content="text/html; charset=utf8" />
-charset=windows-1250" />
+<meta name="description" content="Něco o mně - moje stránky" />
-<meta name="description" content="Něco o mně - moje
-stránky" />
 <title>Toto je moje stránka</title>
 </head>
@@ Řádek 143: / Řádek 132: @@
 ==== Ukázka téže stránky v prohlížeči ====
-FIXME
+{{:spse:pm3:pasted:20200922-200959.png}}
+====== Shrnutí ======
-====== Shrnutí nejzákladnější struktury stránky ======
+  * **<html>** začíná dokument
+  * **</html>** končí dokument
+  * **<head>** a** </head>** začíná a končí hlavičku, která se sice nezobrazuje na stránce, ale obsahuje některé důležité údaje, například:
+    * **<title>** a **</title>** - titulek vymezující název dokumentu
+  * **<body>** a **</body>**, (co je mezi <body> a </body>, se bude zobrazovat.)
+    * **<body>** je tag, kterým začíná vlastní tělo dokumentu
+    * (angl. body = tělo).
+<notes>
+=== Zdroje ===
+https://www.dumy.cz/material/49715-zaklady-tvorby-www-stranky-v-html-kodu-uvod
+</notes>
-<html>
-začíná dokument
-</html>
-končí dokument
-<head> a </head>
-začíná a končí hlavičku, která se sice nezobrazuje na stránce, ale obsahuje některé důležité údaje, například:
-<title> a </title> - titulek vymezující název
-dokumentu (zobrazuje se v modrém záhlaví IE)
-<body> a </body>,
-Co je mezi <body> a </body>, se bude zobrazovat.
-<body> je tag, kterým začíná vlastní tělo dokumentu
-(angl. body = tělo).