10. díl - Rámy - 1. část
V dnešním článku se podíváme na často odsuzované rámy, které používají zejména začátečníci, protože se dají jednoduše použít. Profesionálové by se jim měli vyvarovat, ale pokud po nich opravdu toužíte, dnes se dozvíte, jak je používat.
Co to vlastně rámy jsou
Než začneme s psaním kódu, musíme si říct, co to vlastně rámy jsou. Stránka je většinou rozdělena na 2 nebo 3 oblasti obdélníkového tvaru. Oblastí může být samozřejmě více, ale 2 a 3 oblasti jsou nejpoužívanějšími kombinacemi. Ze začátku si vybereme 2 oblasti. V podstatě to jsou 3 soubory (při 2 oblastech). První soubor je soubor hlavní, který určí, jak se vlastně mají rámy sestavit - jestli mají být nad sebou nebo vedle sebe atd. Tento soubor určí i titulek stránky (značka <title>), ikonku a další drobnosti. V tomto souboru nenajdeme značku <body>. Nahradí ji totiž značka <frameset> (více se dozvíte dále v článku). K tomuto souboru také budeme přistupovat prostřednictvím prohlížeče. Ten také načte zbylé dva soubory, ve kterých se nachází obsahy oblastí - rámů. V těchto souborech můžete určit titulek i ikonku, ale ve výsledné stránce se to neprojeví.
Základem je <frameset> - skupina rámů
<framset> jak už anglický název napovídá je skupina rámů. Je to párová značka, která se uvádí vždy za hlavičkou. Ve stránce, kde se nachází rámy nesmí být tělo stránky - <body>. Pokud by jste tam tuto značku uvedli, rámy nebudou fungovat. Ve <frameset> můžou být pouze značky <frame> v závislosti na nastavení vlastnosti cols nebo rows a další <frameset>.
Vlastnosti značky <frameset>
<frameset> obsahuje 6 vlastností:
| Vlastnost | Význam | Hodnoty | Podpora* |
| cols | rozdělení do sloupců | *, pixely a procenta určující šířku rámu (oddělené čárkou) | všude |
| rows | rozdělení do řádků | *, pixely a procenta určující výšku rámů (oddělené čárkou) | všude |
| border | šířka rámečku mezi rámy | pixely | FF, CH |
| bordercolor | barva rámečku | barva | CH, IE |
| frameborder | zobrazit rámeček | 0, 1, no, yes | FF, CH |
| framespacing | to co border | pixely | IE |
* - testováno v prohlížečích Mozilla Firefox v8.0 (FF), Google Chrome v15.0.874.121 (CH) a Internet Explorer 9 (IE)
Požadovaná vlastnost je buď cols nebo rows. Ve <frameset> může být pouze jedna tato vlastnost. Tyto vlastnosti vyčleňují prostor pro rámy. Kolik hodnot oddělené čárkou, tolik musí být ve <frameset> rámů. Pro lepší použití je zde speciální hodnota *, která znamená, že rám bude mít takovou šířku/výšku, kolik na něj zbyde místa.
Jakákoliv hodnota vlastnosti frameborder se v Google Chrome znamená nezobrazení rámečku. V Internet Exploreru rámeček pouze zesvětlá nebo ztmavne.
Samotný rám - <frame>
Rám se zapisuje značkou <frame>. Jedná se o nepárovou značku. V každém <frame> se načítá samostatná stránka, takže pokud máte na stránce 10 rámů, bude se vám načítat 10 samostatných stránek (pokud jim nedáte stejné URL) + stránka, kde je udáno jejich sestavení. Rám se vyskytuje ve skupině rámu <frameset>, který jim dává podle pořadí v kódu požadované rozměry.
Vlastnosti značky <frame>
Rám může mít až 8 vlastností. Z nich je povinná 1 - src. Je také dobré uvést vlastnost name, kvůli odkazům:
| Vlastnost | Význam | Hodnoty | Podpora |
| src | adresa zobrazované stránky | URL | všude |
| name | jméno rámu pro odkazy | libovolné | všude |
| scrolling | povolení rolování | yes, no, auto | CH |
| noresize | zablokování změny velikosti rámu myší | žádné | všude |
| marginheight | vertikální okraj rámu | pixely | FF |
| marginwidth | horizontální okraj rámu | pixely | FF |
| frameborder | zobrazit rámeček | 0, 1, no, yes | CH |
| bordercolor | barva rámečku | barva | IE |
Všechny hodnoty vlastnosti frameborder v Google Chrome znamenají, že rámeček nebude zobrazen, pouze hodnota 1 rámeček zobrazí.
Příklad rámové stránky s 2 sloupci
V následujícím příkladu se můžete podívat na rámovou stránku, která bude mít 2 sloupce. První z nich bude menu a bude mít 200px, druhý bude obsah a bude mít zbylou velikost. Navíc nepůjde myší měnit velikost rámů. Stránka počítá s existencí souborů menu.html a obsah.html ve stejném adresáři. Doplňkovým souborem je ještě obsah2.html, na který je odkazováno z prvního rámu.
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=windows-1250">
<title>Zkušební stránka z rámů</title>
</head>
<frameset cols="200,*">
<frame src="menu.html" name="menu" noresize>
<frame src="obsah.html" name="obsah" noresize>
</frameset>
</html>
Můžete se podívat na výsledek.
Odkazování do rámů
Pokud jste se podívali na výsledek předchozího příkladu a klikli jste na nějaký odkaz v menu, jistě vás zaujalo, že stránka se nazobrazila přes celou stránku, ale pouze v rámu "obsah". Je to proto, protože odkaz má nastavenou vlastnost target se jménem rámu (vlastnost name). Pokud tedy budete chtít přepsat rám s názvem "obsah", stačí do vlastnosti target (cíl) odkazu dát název rámu, tedy "obsah":
Tento odkaz se nanačte na celou stránku, ale pouze do rámu s názvem "obsah". Pokud by takovýto rám neexistoval, otevře se nový panel, který si tento název podrží a pokud ho nezavřete a znovu kliknete na odkaz se stejným target, stránka se načte do již existujícího panelu.
Pokračování příště
V druhé části se podíváme na automatické odkazování odkazů do určitého rámu, naučíte se používat tzv. multi-rámy, dozvíte se, co dělat, když prohlížeč rámy nepodporuje a nakonec si ukážeme vnořené rámy.