2.ročník IKT - tvorba webových stránek

Základy

Co je to webová stránka

Je to stránka s informacemi ve formě hypertextu. Více webových stránek tvoří web. Tvoří se prostřednictvím HTML, CSS a JavaScriptu.

Struktura HTML dokumentu

Základní značky: html, head, body, , !doctype.

Význam některých HTML značek

značka	(ne)párová	výynam
<html>	P	ohraničuje html dokument
<head>	P	hlavička dokumentu
<body>	P	tělo dokumentu
<p>	P	odstavec
<br>	P	tvrdé odřádkování

Pokud potřebujeme uspořádat text do řádků a sloupců, můžeme použít html tabulku -viz. výše. jíný způsob uspořádaní textu je tzv."přeformátovaný text":

 
značka     význam 
------------------------------------------------
 <html> párová  ohraničuje html dokument 
 <head> párovcá hlavička dokumentu 
 <body> párová tělo dokumentu
 ------------------------------------------------

Odkazy

Jak se dělá odkaz

Hyperlink se obvykle říká hypertextovému odkazu, který je důležitou součástí internetu a každé webové stránky. Odkazy umožňují uživatelům kliknout na kousek textu nebo obrázek a dostat se přes něj na jinou webovou stránku. Jsou tedy důležitou součástí prohlížení internetu. Tvorba hypertextových odkazů (hyperlinků) však vyžaduje pouze použití krátkého kousku HTML kódu. Přidejte atribut "href", který označuje destinaci daného hyperlinku. Všimněte si, že pokud destinace daného odkazu je na vnější webové stránce, tak budete muset v kódu použít celé URL (obvykle začíná s "http"). Pokud uvedete pouze jméno dané stránky, tak adresář aktuální stránky bude fungovat jako hlavní adresář (tzv. parent directory) i pro daný odkaz. Atribut target specifikuje kam se má odkaz otevřít. Odkaz (anchor). Klasický odkaz: <html> a href="url">Text odkazu.

Příklady odkazů

Odkaz na portál portál seznam.cz

Odkaz na konkrétní článek na seznamu

Odkaz na pokusný dokument (ve stejné složce)

Odkaz na 1.kapitolu pokusný dokument 2 (ve stejné složce)

Odkaz na 2.kapitolu pokusný dokument 2 (ve stejné složce)

Odkaz na 3.kapitolu pokusný dokument 2 (ve stejné složce)

Tento dokument se otevře v nové kartě.

Tento dokument se otevře v novém okně jménem redbull.

Tento dokument se otevře v nové kartě.

Tento dokument se otevře v novém okně jménem redbull.

Obrázky

jak se vloží obrázek

tady svymi slovy...

příklady

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse sagittis ultrices augue.
Aliquam ornare wisi eu metus. Aliquam erat volutpat. Sed elit dui, pellentesque a, faucibus vel, interdum nec, diam. Donec vitae arcu. In rutrum. Etiam dictum tincidunt diam. Praesent in mauris eu tortor porttitor accumsan. Duis sapien nunc, commodo et, interdum suscipit, sollicitudin et, dolor.

Aliquam id dolor. Nunc dapibus tortor vel mi dapibus sollicitudin. Maecenas ipsum velit, consectetuer eu lobortis ut, dictum at dui. Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet ut et voluptates repudiandae sint et molestiae non recusandae.