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
Moderní platforma pro vytvoření vašeho nového webu – Wix.com.
Nyní už můžete mít web zdarma.
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       19 815×

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 Otevřené bankovnictví usnadní život nejen jednotlivcům, ale i firmám.

Otevřené bankovnictví usnadní život nejen jednotlivcům, ale i firmám.

Většina lidí by ráda obsluhovala své bankovní účty z jednoho místa. Díky evropské směrnici o platebních službách PSD2 by se brzy mohlo jednat o realitu. Některé tuzemské banky již služby takzvaného otevřeného bankovnictví umožňují, nejpozději od září by měly svá API rozhraní zpřístupnit vývojářům třetích stran. To otevírá prostor pro fintech firmy a start-upy, ale třeba i vývojáře ERP a fakturačních systémů, kteří by díky propojení svých produktů s bankami významně ulehčili klientům při správě financí.

Reklama
Reklama
Obrázek ke článku Velké srovnání TOP e-shopových řešení!

Velké srovnání TOP e-shopových řešení!

Předmět případové studie je ​středně velký e-shop​ s počtem produktů do 5 000, který chce expandovat na slovenský trh a potřebuje ​druhou jazykovou mutaci v eurech ​na vlastní doméně.

Výběr vhodného systému závisí na mnoha aspektech a měl by být pečlivě zvážen na základě potřeb a konkrétních požadavků plánovaného nebo migrovaného e-shopu.

Obrázek ke článku Master Data Management a jak nám pomůže

Master Data Management a jak nám pomůže

Master Data (česky také kmenová data) jsou data sdílená napříč různými systémy, nemění se příliš často a netransakční. Jedná se o informace o obchodních partnerech, produktech, vlastních pracovnících. Objednávky, faktury, účetní zápisy do této oblasti nespadají.

Obrázek ke článku Startup DoDo zajistí městskou logistiku pro RunCzech

Startup DoDo zajistí městskou logistiku pro RunCzech

Startup DoDo se stává důležitým partnerem RunCzecha na významných běžeckých závodech včetně 25. ročníku Volkswagen Maratonu Praha se bude starat o logistické zázemí. Lídr v oblasti městské logistiky bude mimo jiné zásobovat občerstvovací stanice a pomůže rovněž se zajištěním televizních přenosů ze závodů.

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