HTML II - 6. lekce
 x   TIP: Přetáhni ikonu na hlavní panel pro připnutí webu

HTML II - 6. lekceHTML II - 6. lekce

 
Hledat
Vybavení pro Laser Game
Spuštěn Filmový magazín
Laser Game Brno
Laser Game Ostrava

HTML II - 6. lekce

Google       Google       30. 9. 2006       20 545×

V této lekci se podíváme na rámce.

Reklama
Reklama
V této lekci se vám pokusím vysvětlit, jak a proč používat rámy. Nyní je už tato funkce možná překonaná a z mnoha ohlasů je neprofesionální, ale pokud se ví, jak mají být rámce používány a jak to udělat, aby to vypadalo hezky, dá se tím udělat i velice pěkná stránka.

K čemu jsou rámce dobré?

Rámce se používájí, když chcete udělat jednu část stránky statickou (pořád stejnou) a druhou část dynamickou (měnící se). Pokud děláme rámcovanou stránku (celou stránku rozdělujeme třeba na 2 rámce), tak vše napíšeme do tagu <HEAD> a </HEAD> a tag <BODY> tam bude jen k tomu, co se má vypsat, když prohlížeč neumí rámce. V případě použití vloženého rámce, se vše zapisuje tak, jak má. Možná si řeknete: „To musí být strašně obtížné“. Ale naopak. Tato zdánlivě náročná část si vyžádá jen několik minut psaní kódu.

Nyní se podíváme, jak bude vypadat syntaxe.

<frameset>
<frame>
<frame>
</frameset>

Toto je taková hodně ořezaná syntaxe rámcované stránky. Teď si rozebereme parametry, jejich obvyklé hodnoty a k jakému tagu je přiřadíme.

Tag frameset musí obsahovat minimálně jeden parametr navíc. Máme na výběr ze dvou parametrů. Můžeme použít parametr cols – použijeme, pokud chceme stránku rozdělovat na sloupce; parametr rows – při rozdělování stránky na řádky. Tomuto parametru musíme přiřadit nějakou hodnotu. Bude to číslo, a to buď v pixelech (jednotka px) nebo v procentech (jednotka %). Jednotlivé velikosti rámů oddělíme čárkou.

<frameset rows="25%, 50%, 25%">

Takto docílíme toho, že stránka se rozdělí na tři části: První bude vysoká 25 % požadované stránky, druhá 50 % požadované stránky a třetí opět 25 % stránky. Dohromady 100 %, akorát se nám to tam vejde. Pokud chceme použít pixely, postupujeme následovně:

<frameset rows="25px, 50px, 25px">

Tím se stránka rozdělí na 25, 50 a 25 pixelů. Rozdíl je v tom, že při použití procent na vyšším rozlišení vyjdou rámce akorát na celou stránku a při nižším také, ale při použití pixelů to na jednom rozlišení vychází přesně a na nižším třeba kousek přebývá.

Jak rámce používat a jak do nich odkazovat?

Nyní jsme si vysvětlili, jak nadefinujeme počet rámců a jejich velikost. Nyní každému rámu nastavíme

  • jak se má jmenovat (důležité pro otevření stránky v rámu)
  • jaký soubor se v něm má otevřít po otevření stránky
  • vypnutí možnosti přenastavení velikosti

Jedna z nejdůležitějších nastavení rámce je jeho jméno. Jméno využijeme, když budeme chtít stránku otevřít v určitém rámci. Uvedu příklad:

Na rámec s nastavením

<frame name="super_ramec">

do něj odkážeme odkazem

<a href="soubor.html" target="super_ramec">Odkaz zde</a>

Při nastavování vlastností rámců postupujeme podle toho, jak jsme zadali hodnotu u cols/rows. Jednoduše řešeno, první tag frame bude nastavení toho, co je v cols/rows napsáno jako první. Celá syntaxe by ve výsledku mohla vypadat třeba takto:

<frameset rows="25%, 49%, 26%">
<frame name="horni" src="horni_ramec.html"> (nastavení rámce co měří, 25%)
<frame name="prostredni" src="stredni_ramec.html"> (nastavení rámce, co měří 49%)
<frame name="dolni" src="dolni_ramec.html"> (nastavení rámce, co měří 26%)
</frameset>

Jak vydíte, u tagu frame jsem použil nový parametr src. Tím se určuje, co se zobrazí v rámci hned po načtení stránky jako takové. Pokud není stránka nastavena v src nalezena, vyhodí to v rámci chybu 404 (nenalezeno).

Jak zrušit zvětšovnání:
Pokud nastavíte rámcovanou stránku tak, jak jsem před chvílí napsal, uživatel si bude moci za dělící čáru mezi rámci prostě chytnout a rozšířít ji tak, jak potřebuje. To se dá jednoduše vypnout přidáním parametru noresize k tagu frame.

Pokud při definici velikosti rámců použijeme znak *, znamená to zbytek stránky oproti ostatním hodnotám.

Pokud někde místo frame dáte frameset, můžete třeba zkombinovat rows a cols, čímž vám vznikne třeba stránka 4 rámů ve tvaru čtverce.

Rámce vložené

Pokud máme stránku, kde chceme mít stejné okolí a měnit pouze jedno místo nebo plochu, můžeme tak učinit pomocí vložených rámcu. Tento tag je PÁROVÝ. Syntaxe tagu:

<iframe name="jmeno_ramce" width="500" height="500"></iframe>

Přičemž name je jméno rámce a ostatní parametry by neměly být ničím neznámým.

Shrnutí

Na závěr dnešní lekce si shrneme, jak vypadá kompletní syntaxe rámců, vložených (inline) rámců a jak do nich odkazujeme.

Rámce:

<html>
<head>
<frameset cols="25%, *">
<frame name="levy" src="leva_strana.html" noresize>
<frame name="hlavni" src="hlavni_strana.html" noresize>
</head>
</html>

A pokud chceme, aby se stránka zobrazila v hlavním rámci, do levého umístíme kód:

<a href="sranka.html" target="hlavni">Odkaz</a>

Rámec vložený:

<iframe name="iframe" width="500" height="500"></iframe>

Odkážeme stejným způsobem, jen pozor, aby se hodnoty parametrů name a target při odkazování do rámců shodovaly!

Domácí úkol

Udělejte mi stránku, ktérá bude rozdělena na rámce do sloupce, přičemž jeden bude mít velikost 45 %, druhý 25 % a třetí 40 %. Jak jednoduché že?

Příště

Příště se podíváme na DOCTYPE.

×Odeslání článku na tvůj Kindle

Zadej svůj Kindle e-mail a my ti pošleme článek na tvůj Kindle.
Musíš mít povolený příjem obsahu do svého Kindle z naší e-mailové adresy kindle@programujte.com.

E-mailová adresa (např. novak@kindle.com):

TIP: Pokud chceš dostávat naše články každé ráno do svého Kindle, koukni do sekce Články do Kindle.

Hlasování bylo ukončeno    
0 hlasů
Google
(fotka) Radek BoudaRadek Bouda studuje na Fakultě aplikovaných věd Západočeské univerzity v Plzni. Programuje v jazyce Java a zajímá se platformu .NET. Kromě programování má rád také cyklistiku, volejbal, skauting a pohyb venku obecně.
Web     Twitter     Facebook    

Nové články

Obrázek ke článku Konference: Moderní informační systémy podporují automatizaci

Konference: Moderní informační systémy podporují automatizaci

Současná situace v šíření onemocnění Covid-19 klade na řadu firem nové nároky a mnohé z nich jsou nyní více než kdy jindy závislé na nejmodernějších informačních technologiích. Proto i v oblasti podnikových informačních systémů vidíme rostoucí důraz na automatizaci nebo na důslednou integraci. Také o těchto trendech se bude mluvit na konferenci Firemní informační systémy, která se koná 24.9.2020 v pražském Kongresovém centru Vavruška na Karlově náměstí.

Reklama
Reklama
Obrázek ke článku Nebezpečí ukrytá v USB: z nuly na škvarek za pět sekund

Nebezpečí ukrytá v USB: z nuly na škvarek za pět sekund

Za cenu šesti dolarů lze celkem bez obtíží koupit nový, líbivě vyhlížející flash disk. Přidaná hodnota, které se vám spolu s ním dostane, už tak moc líbivá není. To, co se před pár sekundami tvářilo jako externí disk, se po připojení k počítači změní v důmyslné elektrické křeslo, které vaše zařízení v onen příslovečný škvarek promění za pár sekund. Cílovou skupinou pro koupi takových zařízení by mohli být záškodníci, kteří by tímto způsobem osnovali pomstu třeba vůči záletnému partnerovi. 

Obrázek ke článku Znalosti, dovednosti i prestižní titul MBA: Jde to i moderně a online

Znalosti, dovednosti i prestižní titul MBA: Jde to i moderně a online

Snad nikdy není špatná příležitost na investici do hodnotného vzdělání. Obzvlášť v případě, že absolvent dovede teoretické poznatky přetavit v praktické dovednosti, využitelné při řešení problémů i v komunikaci. Právě na to se specializuje studijní program MBA Řízení informačních technologií, vyučovaný na Business Institutu.

Obrázek ke článku Coding Bootcamp Praha: Obor IT krize nepoznamenala, žádaní jsou weboví vývojáři

Coding Bootcamp Praha: Obor IT krize nepoznamenala, žádaní jsou weboví vývojáři

Pandemie Covid-19 otřásla trhem práce v základech. Dopady krize pocítilo celkově až 45 % zaměstnanců. Není divu, že čím dál větší jistotu přináší obor IT. Ten zůstal krizí téměř nepoznamenán a při nutnosti začít dělat věci na dálku se ještě více ukázalo, jak moc mnohé firmy kvalitní IT potřebují. Do IT nyní přicházejí začátečníci, kteří v něm vidí lukrativní budoucnost a jistotu, ale i freelanceři a zaměstnanci z oborů zasažených krizí

Hostujeme u Českého hostingu       ISSN 1801-1586       ⇡ Nahoru Webtea.cz logo © 20032020 Programujte.com
Zasadilo a pěstuje Webtea.cz, šéfredaktor Lukáš Churý