Základy HTML – vkládání objektů

Základy HTML – vkládání objektů

<img> - obrázek (angl. image), nepárový tag; do stránky se vloží obrázek načtený z jiného souboru; artibuty: src - umístění souboru s obrázkem; v souboru je umístěna pouze cesta k obrázku. Po přemístění „htmlsouboru“ na jiný počítač, na server v internetu apod., cesta se změní a obrázek se nezobrazí. Řešením je umístění obrázku do stejné složky s „html souborem“ a do src napsat jen název obrázku. Název by měl být bez diakritiky a jedno slovo - <imgsrc="fotbal.jpg"> Vložení obrázku

alt - alternativní text, zobrazuje se ve stránce tam, kde se nenačte obrázek width, height– šířka a výška obrázku, udává se v pixelech nebo v %, zadáme-li pouze jeden rozměr, je druhý dopočítán a obrázek se nedeformuje border– tloušťka rámečku (border=“0“- bez rámečku) vspace, hspace- vertikální a horizontální odsazení od okolních objektů align– zarovnání obrázku s okolím, obtékání obrázku (right, left), vertikální umístění obrázku na řádku (top, middle, bottom, baseline atd.) Vložení obrázku

<a> </a> - vše co je mezi těmito značkami je odkaz, může to být text, obrázek apod. artibuty: href– zapíše se jako URL (UniqueResourceLocator) stránky, na kterou je odkaz přesměrován; odkaz může otevírat i dokument name– jméno záložky, v dokumentu se vytvoří záložka <a name=“zacatek“></a>, na jiném místě se vytvoří odkaz <a href =“#zacatek“>Příklad</a>, který převede uživatele tam, kde je záložka target – určuje okno, ve kterém se zobrazí obsah Odkazy - Hypertext Příklad

Seznamy představují v HTML to, co jsou ve Wordu odrážky, číslování a předsazení • nečíslovaný seznam Př. V IT probíráme <ultype="square"> <li>psaní textu</li> <li>internet</li> <li>grafiku</li> </ul> Seznamy

číslovaný seznam Př. Moje nejoblíbenější předměty jsou: <ol> <li>Informatika</li> <li>Matematika</li> <li>Tělocvik</li> </ol> Seznamy

seznam definic Př. <dl> <dt>Elipsa</dt> <dd> je uzavřená křivka v rovině. Všechny body elipsy mají stejný součet vzdáleností …</dd> <dt>Kružnice<dt> <dd>je množina všech bodů v rovině, které leží ve stejné vzdálenosti, označované jako poloměr</dd> </dl> Seznamy

<table> </table> - uzavírá celou strukturu tabulky atributy tabulky: • align-obtékání tabulky ostatním textem – right, left, center • cellpadding– vnitřní okraj buněk – v pixelech • cellspacing - vnějšíokraj buněk – v pixelech • border – šířka rámečku buněk – v pixelech • width, height - šířka a výška tabulky – v pixelech nebo v % • background – obrázek na pozadí • bgcolor – barva pozadí Tabulky

<tr> </tr> - začátek a konec řádku tabulky, musí být uvnitř elementu <table> a smí obsahovat pouze buňky (<td> a <th>) <td> </td> - buňka tabulky, musí být umístěna v řádku <tr> atributybuňky: • align, valign – horizontální a vertikální zarovnání obsahu • width, height - šířka a výška buňky • bgcolor, background – barva pozadí a obrázek na pozadí • rowspan – sloučení buněk - zabírá více řádků • colspan - sloučení buněk – zabírá více sloupců Tabulky

<th> </th> - hlavičková buňka, má stejné vlastnosti jako <th>, ale text je tučný a umístěný na střed <caption> </caption> - nadpis tabulky, umístěno mezi <table >a prvním řádkem tabulky Prázdná buňka – nevykreslí se rámeček, proto do ní píšeme tzv. nedělitelnou mezeru Tabulky Příklad

Základy HTML – vkládání objektů