FAQ

často kladené otázky

FAQ znamená frequently asked question nebo tak něco. Prostě často kladené dotazy. Pokud dostanu nějaký dotaz alespoň dvakrát, tak ho sem umístím i s odpovědí, abych na to nemusel odpovídat potřetí.

HTML obecně - Odkazy - Tabulky - Rámy - Pozadí - CSS - Aktivní prvky - Skripty

HTML obecně

Jak je to s uvozovkami v HTML zápisu? např: <td width="50"> patří tam ty uvozovky nebo ne? 

Podle specifikace 3.2 tam uvozovky byt nemusí, pokud hodnota atributu neobsahuje mezeru nebo jiné divoké znaky. Ale kdo ví, jak funguji všechny prohlížeče. Ve specifikaci XML a XHTML tam uvozovky musejí být všude. Když se dají všude, tak se nic nezkazí.

Ako mam spravit, aby pri zmene rozlisenia obrazovky bola www stranka stale v strede?

Nejjednodušší způsob je uzavřít celou stránku do tabulky s vycentrováním <table align=center>, ale to má spoustu jiných nevýhod.
Jiný způsob je použít dvou zanořených oddílů. Příklad jediného spolehlivého zápisu: 
<div style="align: center" align="center"><div align="left" style="width: 700px; align: left">Obsah stránky</div></div>
Seznam a Centrum užívají tohoto spolehlivého zápisu
<center><table width="760"><tr><td>Obsah stránky</table></center>
Více o centrování (Sova v síti)

Jak změnit velikost písma?

Starší způsob je uzavřít text do tagu <font> a jeho atributem size měnit velikost:
<font size="4">text</font>
vypadá takto: text
Je 7 stupňů písma, 1 je mrňavé, 3 běžná velikost a 7 největší.
Novější způsob zvětšování písma vychází z použití kaskádových stylů CSS, např. se do hlavičky stránky vloží stylopis
<style>
body {font-size: 13px}
td {font-size: 12px}
h1 {font-size: 18px}
</style>
Tento zápis například udělá písmo v celé stránce (body) veliké 13 pixelů, písmo v tabulce 12px a nadpisy h1 velikostí 18px. Jsou i jiná použití kaskádových stylů (CSS).

Jak udělat, aby se písmo nedalo zvětšit v prohlížeči?

Když se nastaví velikost v pixelech (px) nebo typografických bodech (pt), nepůjde v Internet Exploreru zvětšit. Pokud se velikost nenastaví nebo se použijí stupně v tagu <font> (nebo hodnotami small, large apod. v css), písmo půjde zvětšovat. V Mozille nejde udělat fixně velké písmo.
Text, u kterého chcete, aby ho uživatelé běžně četli, nechte velikost zvětšovací. Nemělo by se dělat příliš malé písmo, jak je dnes často k vidění.

Jak se v HTML udělá tabulátor (to, co je ve Wordu na vodorovném pravítku)?

V HTML nejde udělat nic jako tabulátor. Pro odšoupnutí textu je potřeba používat pozicování nebo okraje, pro tabulková data tabulku.

Odkazy

Jak udělat žlutou bublinu u odkazu?

<a href="někam" title="Popisek odkazu v bublině">Text odkazu</a>

Jak odkaz otevřít do nového okna?

<a href="někam" target="_blank">Text odkazu</a>
Více informací: Nové okno otevřené odkazem

Jak odkazy otevírat do stále jednoho nového okna?

<a href="někam" target="libovolne_jmeno">Text odkazu</a>,
ale pozor, to okno, kam se to otevřelo, může zůstávat na pozadí, takže si toho čtenář nevšimne.

Jak otevřít odkaz do okna bez nabídky, stavového řádku, adresy a lišt?

Je potřeba použít javascript:
<a href="někam.html" onclick="open('někam.html', 'jmenookna', ''); return false">Text odkazu</a>
má to víc nastavení, které rozebírám u metody window.open

Jak odkazem stránku jenom odrolovat na určité místo (nechodit na jinou stránku)?

Odkaz se namíří na kotvu. Ta se nejprve musí vložit do stránky na to správné místo.
<a name="zalozka"></a>
a pak se na ni může odkazovat pomocí křížku:
<a href="#zalozka">Odkaz jinam na tutéž stránku</a>
Více v textu o kotvách.

Jak zařídím, aby odkaz vypadal jako tlačítko?

Je více možností, asi nejlepší je využít CSS styly. Podívejte se na příklad textového odkazu jako tlačítko a zobrazte si zdroj.

Rada by som vedela, ako mozem napisat hypertextovy odkaz tak, aby mi text nepodciarklo.

Je potřeba do hlavičky stránky vložit stylopis:
<style>
a:link, a:visited {text-decoration: none}
</style>
Když tam dáte jenom a a nikoliv to a:link, a:visited, tak to nebude fungovat v IE4.

Jak udělat odkaz, který mění barvu při přejíždění myší, třeba na modrou?

Je potřeba do hlavičky stránky vložit stylopis:
<style>
a:hover {color: blue}
</style>

Potřebuju, aby když namířím odkaz na dokument Wordu *.doc, aby se neotevíral, ale stáhnul. Jak to udělat?

Vlastně to nejde zařídit. Jestli se budou soubory (ne HTML) otevírat nebo ukládat, závisí na nastavení počítače u klienta. Nevím ani přesně kde se to nastavuje. Má to něco společného s takovým dialogem, kdy se prohlížeč ptá, jestli chci otevřít soubor rovnou nebo uložit na disk. Pod tím je volba "příště se již neptat".
Někomu se to prostě otevírá a někomu ne. Takže doporučuji zabalit ten doc do zipu, protože zip má většina lidí nastavený na stahování. Podobně i u souborů jiných typů, např. pdf.
Jiná možnost je nastavit v mime-types serveru doc jako archive/zip (pokud můžete konfigurovat server). Pak se to bude stahovat pokaždé, ale je to dost prasárna.
Jinou možnost poradil Jakub Vrána: použít HTTP hlavičku "Content-Disposition", která lze poslat např. v PHP nebo možná jde nastavit i na serveru. Např.
Content-Disposition: attachment; filename="fname.ext"

jak otevřít program z odkazu, aniž by se zobrazilo okno, zda chci program otevřít, nebo uložit. Příklad : <a href="program.exe" target="_blank">spusť</a>

To naštěstí nejde udělat. Je to bezpečnostní opatření Internet Exploreru. Dovedete si představit, že by se z webu automaticky spouštěly programy? Katastrofa. Uživatel si může v nastavení toto zabezpečení vypnout, jmenuje se to Softwarové oprávnění kanálu.

Tabulky

Jak dosáhnout toho, abych hodnoty ze dvou sloupců v tabulce (na jednom řádku) mohl použít k matematickému výpočtu a výsledek abych dostal v dalším sloupci (na stejném řádku)?

Odpověď je jednoduchá: NEJDE TO. Jazyk HTML je pouze zobrazovací. Ten problém je potřeba nějak obejít. (Uvažuje se o použití atributů axis a axes, ty ale zatím v prohlížečích nefungují.)

Jak udělat, aby měla tabulka tenkou jednopixelovou mřížku? Pořád mi to dělá 2 pixely.

Dá se to udělat pomocí CSS stylů aplikovaných na buňku td, ale jednodušší je použít css2 vlastnost border-collapse na tabulku:
<table border="1" style="border-collapse: collapse">
funguje to sice jenom v novějších Explorerech a Mozillách, ale ty už převažují.

Potřebuju změnit písmo v celé tabulce a nechce se mi to psát po buňkách. Jde to nějak najednou?

Stačí nastavit CSS styl, např. takto:
<style>
td {font-family: Arial; font-size: 13px}
<style>
pokud by se to mělo týkat jenom jedné z více tabulek na stránce, použijí se třídy.

Rámy

Jak po kliknutí na odkaz otevřít dvě stránky každou v jiném rámu.

Dva způsoby. 
1. Jednodušší je, když si dáš ty dva frejmy vedle sebe a uděláš stránku, která je spoji. Potom budeš načítat tu stránku na místo, kde mají být ty dva.

2. Elegantnější a těžší je tohle:

<a href="stranka1" target="ram1" onclick="parent.ram2.location.href = 'stranka2.htm'">
Někdy je tam potřeba napsat parent.parent vícekrát za sebou. 

Udělal jsem si rámy, ale naskytl se problém: Když tam například mám odkaz na Seznam a kliknu na něj, objeví se sice stránka Seznamu, ale můj levý rám (obsah) tam zůstane. Co mám tedy udělat pro to, aby se tam ten rám nezobrazil?

Do odkazu <a href="http://seznam.cz> přidejte target="_top", takže to bude vypadat takhle:
<a href="http://seznam.cz target="_top">Seznam</a>

Target="_top" způsobí, že se odkaz přepne do celého okna. Zkuste také experimentovat s hodnotami _blank a _parent.

Pozadí

Další odpovědi hledejte na stránce Vše o pozadí stránky a objektů v HTML a CSS

Jak nastavit pozadí v rámcích, tak aby kopírovalo skutečnou velikost rámce? Pokud si vytvořím vlastní pozadí (v Corelu 8) a zadám cestu v nastavení rámce, zobrazí se mi přes celou obrazovku několikrát vedle sebe a pod sebou. Existuje nějaký příkaz, který by pozadí přizpůsobil velikosti rámce?

Velikost pozadí nelze přizpůsobit velikosti rámu. Toť smutná praxe. 
Pozadí musí být vždy soubor gif nebo jpeg. Pokud Corel vyexportuje html, tak to je na nic. Protože jsou gif i jpeg bitmapové formáty, tak je nejde roztahovat bez ztráty kvality, jak by to bylo možno s corelovskými vektorovými formáty. 
Existují ale určité způsoby, jak pozadí nějak zmanipulovat. Prostudujte si v přehledu CSS - přehled vlastností a hodnot vlastnosti pozadí, mrkněte se na vkládání pozadí do tabulek ve formátování tabulek
a na Design pomocí tabulek.
Častou praxí je postup přesně opačný -- nepřizpůsobovat pozadí podle textu, ale text podle šířky pozadí. Text se vkládá do rozměrovaného oddílu (tag div v HTML) nebo do přesně široké tabulky. 
Nebo se dá udělat "pseudopozadí". Obrázek vložit do stránky a nastavit mu styl pozicováním tak, aby překrýval celou šířku stránky, šoupnout ho nahoru a nastavit mu z-index na něco záporného.
Osobně doporučuji zaměřit se pro začátek na důležitější věci, než je pozadí stránky. Důvodem je zejména velký datový přenos a matení čtenáře. Já jsem třeba po dlouholetých zkušenostech od aplikace pozadí zcela ustoupil, stejně jako většina webových profesionálů (třebaže se k nim nepočítám). 

Potrebuji vycentrovat pozadi (background) na stred stranky a to jak vertikalne tak horizontalne. Aby byla zobrazena jen jedna kopie obrazku, ktery bude pouzit pro pozadi. Dale bych se chtel zeptat jestli uz ses setkal se statickym pozadim. Pozadi stoji a text a grafika se hybaji pres stojici pozadi.

Umístit obrázek na pozadí jenom jednou a doprostředka jde jen v některých prohlížečích. Naštěstí nejpoužívanější prohlížeče MSIE 4 a 5 to dokáží. Jak se to dělá: Používají se na to CSS, kaskádové styly. Jde to zapsat dvěma způsoby, já uvedu ten lehčí (bez stylopisu), kdy deklaraci uvedu přímo v tagu <body>:

<body style=" background: url('cesta/jmenosouboru.gif') fixed no-repeat center center">

Bacha na překlep. Malá chybka způsobí nefunkčnost. Ta čárečka ' se dělá alt+39. Význam hodnot lze najít v přehledu CSS, tam jsou uvedeny i příklady. Je dobré výsledek vyzkoušet ve více prohlížečích a zhodnotit výsledek!

V čistém HTML bez CSS lze udělat pouze "nerolovací" pozadí deklarací <body backround="cesta/soubor.gif" bgproperties="fixed">. V CSS se to dělá vlastností background-atachment: fixed. Pozor na příliš velký obrázek -- jednak se dlouho přenáší (a dokud se nepřenese, tak se nezobrazí většinou nic) a jednak zpomaluje klienta (zejména průhledné pozadí při rolování).

CSS

Potřebuji, aby se mi nedělaly mezery nad a pod odstavcem.

Nejjednodušší je zápis:
<p style="margin-top: 0px; margin-bottom: 0px">
Praktičtější je zápis najednou pro celou stránku do stylopisu v hlavičce stránky:
<style>
p {margin-top: 0px; margin-bottom: 0px}
p {margin: 0px} /*Ještě jednou pro Netscape */
</style>
Více v textu o použití CSS.

Jak mám při použití CSS zarovnat v tagu "table" tu tabulku na střed? Nebo snad stačí normálně napsat: align="center" a je to správně? To mě trochu nepasuje do CSS.

Pomocí CSS nelze zarovnat celou tabulku na střed stránky, musí se použít html atribut align=center nebo se tabulka musí umístit do vystředěného odstavce. Nejspolehlivější je použít <center> okolo tabulky. Je fakt, že to do CSS moc nepasuje. Vlastnost align se vztahuje k zarovnání VNITŘKU elementu, nikoli na samotný element. Neodpovídá to variabilitě atributu align v HTML.
Centrování tabulky se v CSS musí dělat takhle:

<p style="text-align: center">
<table style="margin-left: auto; margin-right: auto">

to obalovací péčko může být <div>
styl u obalovacího prvku je pro Explorer,
styl v tabulce (margin) je pro Mozillu a jiné standardní prohlížeče.

Nefunguje mi vlastnost vertical-align!

Internet Explorer podporuje vertikální zarovnání fakticky jenom u buněk tabulky (<td>).

Jak mám "zalockovat" velikost písma, aby se mi nezvětšovalo, když si uživatel přepne na větší font?

V Internet Exploreru stačí předepsat písmu velikost v pixelech, např.
<span style="font-size: 13px">
nebo totéž udělat pomocí stylopisu. (V jiných prohlížečích se, pokud vím, zvětšuje i takto zadané písmo.)

Pouzivam oddeleni kapitol tagem <hr>. V rozliseni 800*600 vypada stranka relativne dobre, ale v 1024*768 se text zkrati, kdezto obrazek zustava stejny a dojde k tomu, ze oddelovaci linka je ve vysce obrazku z predchozi kapitoly. Dalo by se nejak udelat, aby obrazek byl hezky obtekan textem a oddelovaci linka vytvorena tagem <hr> byla vzdy pod obrazkem?

Tak tohle je zrovna brnkacka. Pridej si do stylopisu radek
hr {clear: both}
Zaruci to, ze kazda cara bude cekat na ukonceni vsech plovoucich elementu. Kdybys to chtel delat bez css, tak to taky pujde, ale bude to pakarna: Pred kazdou caru bys musel dat <br clear="all">. Doporucuji prvni postup.

Lze změnit vzhled formulářového výběrového boxu pomoci CSS, tak jako lze pro IE 5.5 volit barvu lišty?  Ani primy zápis stylu se scroll-..-color položkami mi nefunguje

Udělal jsem pár experimentů a je to opravdu tak -- barvu rolovací lišty u tagu <select> nejde nastavit! Vůbec nijak. Totéž u barvy pozadí checkboxu a selectu. Dá se jedině zprůhlednit v IE pomocí filtrů.

U tagu select mi nefunguje z-index.

To je chyba prohlížečů nebo systémová chyba. Select boxy prostě budou vždy navrchu. Podobně občas chybuje iframe a flashová animace.

V Internet Exploreru 6 se mi nebarví rolovací lišta!

Je potřeba přidat definici barvy lišty pro tag <html> nebo zrušit <!doctype>. Takže teď to vypadá např. 
body, html {scrollbar-base-color: yellow}

Jde pomocí CSS nastavit odkazu target?

Ne, to nejde.

Aktivní prvky

Jak mám naprogramovat, aby vyplněný formulář přišel na mojí e-mailovou adresu?

Napsal jsem o tom celou stránku formulář na mail.

Doporučuji zaregistrovat se na službě www.mailform.cz nebo www.blueboard.cz a sledovat pokyny. Je to nejdokonalejší řešení, protože dřinu již někdo odvedl a teď se tam využívají plody. Pokud by to z nějakých důvodů nešlo, dá se to řešit i svépomocí:

Nejrychlejší řešení bude patrně toto:
<form action="mailto:adresa@někam.cz" method="post" enctype="text/plain"><input ....>Normální obsah formuláře</form>

Pak to stačí akorát vyzkoušet. Poštu odesílá klient, forma bude vidět. Pokud by nevyhovoval zasílaný formát dat, zkuste experimentovat s enctype. Do <form > se dá zkusit atribut enctype="multipart/form-data". Dost často to ale nefunguje, protože u uživatele není nijak nastaven smtp server.

Dá se to udělat i spolehlivěji přes serverový program, ale poskytovatelé to nabízejí zřídka. Já třeba využívám PHP skripty, ale na to je potřeba mít serverová práva. 

Ak mam na www nejaky dotaznik, kt. dana osoba vyplnit - ci je mozne, aby mi tento dotaznik dosiel mailom aj s diakritikou. Zatial mi miesto diakritiky posiela cisla ....

To je právě to enctype="text/plain".

Jak udělat na stránce rozbalovací menu, aby se při přejetí odkazu objevily další odkazy s podrobnější nabídkou? Třeba jako je to vpravo nahoře na stránce microsoft.com.

To není žádná sranda. Musí se to naprogramovat v Javascriptu. Nic pro začátečníky (taky mi to ještě nefunguje). Nebo to lze odněkud ukrást a přepsat hodnoty odkazů. Třeba z Microsoft.com.

Jak na stránku dostanu návštěvní knihu, guestbook?

Je potřeba ji buď naprogramovat v nějakém serverovém skriptu, nebo se zaregistrovat na nějaké službě, která to nabízí zdarma. Třeba http://miniaplikace.blueboard.cz

Skripty

Jak poznám, jestli mám na něco použít JavaScript, nebo něco serverového, třeba PHP?

Obecně se dá říci, že kde není potřeba ukládat informace, stačí JavaScript. Jakmile je ale potřeba uložit informaci pro pozdější použití, je nutné nasadit serverový skript. Ne vždy je ale třeba programovat, protože některé věci nabízejí jako službu vzdálené servery.

1. Mam zacit s klasickym HTML jazykem?
2. Nebo rovnou se zacit ucit JavaScript, dle knihy JavaScript - David Flanagan - Kompletni pruvodce.
3. Jak spolu souvisi HTML a JavaScript - daji se vedomosti z HTML vyuzit pri tvorbe www stranek pomoci JavaScriptu?

O JavaScriptu: nema VUBEC smysl s nim zacinat, pokud neumis delat stranky v HTML. Skripty jsou jenom slehackou na dortu, kde korpus tvori HTML jazyk.  Navic dnes neexistuje globalne pouzitelna verze JavaScriptu (Microsoft ma svuj vlastni), takze odladit aplikaci pro vsechny prohlizece je drsny ukol, se kterym si poradi jenom opravdovi fest profici. Vysledek ovsem ani pak neni nijak uzasny.

JavaScript je zjednodusene receno zpusob, kterym muzes pohybovat s kusy kodu HTML. Dam asi priklad: odstavec cervenym pismem se udela v HTML takhle (pouzivam CSS styly):

<p style="color: red" >Text odstavce</p>

Javascript pritom umi treba po kliknuti na tenhle odstavec zmenit barvu textu na modrou. Dela se to rozsirenim kodu o atribut onclick, jehoz hodnota uz je skript:

<p style="color: red" onclick="this.style.color = blue">Text odstavce</p>,
coz ale funguje jenom v Exploreru, protoze je to Microsofti javaScript. Aby to fungovalo v Netscape, musi se odstavec pojmenovat atributem id:

<p style="color: red" id="odstavec" onclick="document.ids.odstavec.color = blue">

Aby to fungovalo v obou prohlizecich, musis napsat do kodu podminku, ktera bude testovat prohlizec. Jak jiste podle tohoto prikladu chapes, delani dobrych skriptu neni zadna sranda. Hodne lidi udela skript, ktery funguje jenom nekde, coz ale ti autori nikdy nezjisti, protoze to jinde nezkusi, takze si mysli, ze umi psat skripty. Proste jsi-li zacatecnik, vykasli se na Javascript.

Potreboval bych vedet jak docilim toho abych mel na 1 strance nekolik obrazku a po kliknuti na jeden z nich se zobrazil na dalsi strane s jeho názvem.

To je potreba udelat pro kazdy obrazek novou stranku, na ktere bude ten obrazek a jeho nazev jako text. Pokud by tam ten nazev byt nemusel, nemusi se delat nova stranka a staci odkaz namirit na ten obrazkovy soubor

Hľadám fciu alebo script, ktorým by som zakázal použitie pravého tlačítka myši na stránke (napr. aby sa nedal stiahnuť obrázok).

Dá se to napsat v JavaScriptu, ale je to zbytečné, protože zkušení uživatelé dokáží stahovat obrázky i zdroje i bez pravého tlačítka (např. ukládáním, Teleportem, analýzou zdroje, vytažením z cache, starším prohlížečem, matením escapem atd.).
Jakmile dáš jednou na web obrázek, tak se musíš smířit s tím, že půjde stáhnout.
Kdybys přece chtěl ten skript psát, tak se při kliknutí zjišťuje, jestli je event.button rovnou 2 (pravé tlačítko). Jestli jo, tak se to zablokuje třeba alertem. Takže třeba
<body onmousedown="if(event.button == 2) alert('neklikat!')">

Zajímalo by mě, jestli lze JavaScriptem něco uložit a posléze uložená data nějak dále využívat. 

Nejde to. Je to největší omezení JavaScriptu, důvodem je bezpečnost. Jediné informace, které se dají ukládat, jsou cookies, ale ty jsou moc malé, nestálé a přístupné jenom klientovi.

XML

Jak psát v XML běžné stránky?

Poslední dobou získávám pocit, že XML je sice krásná datová struktura, ale pro tvorbu "běžných stránek" se jaksi nehodí. Všechno tam má nějaké ALE. Asi nejlepší je přímé linkování CSS stylů do XML. Hodně základů je uvedeno a www.kosek.cz a dokud to nebudu umět lépe než Jirka (a to asi nebude nikdy), netroufám si o tom psát.

Hlavní problémy stavby běžných (textově bohatých) stránek pomocí XML jsou dva:

• neexistuje opravdu dobrý a POHODLNÝ xml editor
• xml jako datová struktura řeší vlastně úplně jiné věci, než se kterými se setkává tvůrce běžných stránek.

Nejčastěji se pro tvorbu stránek z XML používá XSLT transformace. XML se snaží o předání kompletní strukturované informace v dokumentech a XSLT ty informace transformuje do jiných dokumentů. Vždy jedna ku jedné -- jeden výstupní dokument odpovídá jednomu vstupnímu. To je sice krásná vlastnost, ale tvůrci stránek řeší obvykle něco úplně jiného než problém jedna ku jedné. Řeší to, jak z více (fragmentálních) souborů seskládat jednu stránku, případně více stránek (problém n ku n). Obvykle to řeší PHP (nebo CGI) na straně serveru. Pokud bych chtěl to samé dělat v XML, tak bych musel hodně prasit.

Reklama