Mix web

HTML 1

Úvod do HTML

<HTML></HTML> určuje počátek a konec vlastních dat stránky. Tento tag je povinný, ale většina prohlížečů dokáže stránku zobrazit, i když chybí.

<HEAD></HEAD> je hlavička stránky, která obsahuje několik tagů, které určují vlastnosti stránky

<TITLE> </TITLE> . Do tohoto tagu se zapisuje titulek stránky. Neměl by být příliš dlouhý (max. 64 znaků)

  <BODY></BODY> určuje tělo dokumentu, právě tam budete zapisovat obsah stránky.

Odstavce

K oddělení jednotlivých odstavců slouží tag <P></P>.

Někdy vám může dělat problém, že je text u <P> tagu zarovnán podle velikosti okna prohlížeče, nemůžete přesně určit, jak bude text zarovnán.  Pokud tedy potřebujete určit, kdy se má text vypsat na nový řádek, vložte na konec předešlého řádku tag <BR>

<p> Ahoj, <BR>

 

snad vám to bude k užitku < BR>

 

keli </p>

Odstavce můžeme zarovnávat pomocí atributu align.

 

Hodnoty align mohou být: l eft, center, right.

<p align="left"> Odstavec zarovnaný vlevo (výchozí hodnota). </p>
<p align="center"> Odstavec zarovnaný na střed. </p>
<p align="right"> Odstavec zarovnaný vpravo. </p>

Nadpisy

Nadpisy se dělí podle úrovně a velikosti. Největší je nadpis první úrovně <H1></H1> a nejmenší je nadpis šesté úrovně <H6></H6>.

Pokud chcete   dokument trochu rozdělit, aby se jednotlivé části nepletly, použijte tag <HR>, který zobrazí horizontální čáru přes celou šířku okna prohlížeče.

Pokud vám nevyhovuje základní vzhled čáry, můžete si nastavit některé jeji vlastnosti:

WIDTH="10%" určuje délku čáry, můžete ji zadat

v procentech nebo v pixelech....Na ukázku jsem text odělila čarou  tloušťky1


SIZE="1" tloušťka čáry v pixelech

<HR WIDTH="100%" SIZE="1">

Písmo

Pokud potřebujete změnit fonty, barvu textu, použijte tag <FONT></FONT>, pomocí kterého můžete text různě měnit.

<FONT COLOR="BLACK" FACE="Arial"> text </FONT>

Odkazy

Odkaz je zvýrazněná část textu, ve které se skrývá adresa dalších WWW stránek (URL). Po kliknutí na odkaz prohlížeč otevře okno s novou adresou. V HTML lze odkaz zapsat takto:

<A HREF="http://www.keli.websnadno.cz">text odkazu</A>

Kromě textu můžeme odkazovat i obrázkem. Toho jednoduše docílíme vložením obrázku mezi tagy

<A></A>

<A HREF="http://www. keli.websnadno. cz"><IMG SRC="obrazek.gif BORDER="0"></A>

Atribut BORDER="0" u obrázku <IMG> použijeme pokud nechceme, aby byl okolo odkazujícího obrázku rámeček.

Jestli chcete vytvořit odkaz, který zjišťuje stažení nějakého souboru, do URL uvedete přesnou adresu, kde se soubor nachází.

<A HREF="http://www.odkaz.cz/soubor.zip">soubor.zip</A>

Tak to by asi pro začátek mohlo stačit. Snad vám něco z toho pomohlo a bude vám to k užitku.:-)


Změna barvy odkazu
<style>
<!--
a { color:red }
a:hover {c olor:green }
-->
</style>
Barvu si samozřejmě zvol podle svého
příklad:
<style>
<!--
a {color:red}
a:hover {color:green}
-->
</style>
<a href="http://www.keli.websnadno.cz" title="popis">

Kurzor přesýpacích hodin
<style>
<!--
   a {cursor: wait;}
--->
</style>
<a href="http://www.keli.websnadno.cz">Kurzor přesýpacích hodin</a>

Vytvořte si vlastní ikonku

Ikonku si můžete připravit v nějakém grafickém editoru nebo si jí stáhnou někde z internetu.
Pokud si budete chtít připravit vlastní ikonku držte se následujících rad:

  • Ikonku vytvářejte v rozlišení 16x16, nebo 32x32 v žádném případě nedělejte větší ikonku.
  • Ikonka se musí jmenovat přesně "favicon.ico".
  • Ikonka by měla být jednoduchá nic složitého nejde stejně nakreslit na obrázek s rozlišením
  • 16x16, nebo 32x32.
  • Ikonka tohoto webu je velmi jednoduchá.  

Ikonka v Internet exploreru

V IE se ikonka zobrazuje jen pokud si stránku přidáte k oblíbeným,
ikonka se musí jmenovat favicon.ico a musí být umístěna v hlavní složce webu.

Ikonka v prohlížečích: Mozilla, Netscape, Firefox a Opera

V těchto nejnovějších prohlížečích lze nastavit ikonku pro každou stránku
a přitom není potřeba přidat stránku do oblíbených stačí přidat do hlavičky
následující zdrojový kód.
<link rel="shortcut icon" href="favicon.ico">

Tento zápis funguje všude a nezáleží jaký máte hosting.

Ochrana dat

Zde existuje množství způsobů jak schovat různé informace na stránkách. Nejdříve je nutné si uvědomit, před kým resp. čím dané informace schováváte. Je-li to jen člověk. Můžete podle ruského vzoru použít text psaný barvou pozadí na místě, kde by ho nečekal. Po označení celého textu se skrytý text objeví.


hledáš něco?!?

<p><font color="#ffffff">hledáš něco</font></p>

Zábavné prográmky, které naštvou i potěší

<div style="text-align: center;"><iframe marginwidth="0"
 marginheight="0" hspace="1" vspace="1"
 bordercolor="black"
 src="http://www.bazarekzadara.ic.cz/exesoubory.html" frameborder="0"
 height="700" width="500"></iframe></div

 Tlačítko

<INPUT TYPE="CHECKBOX" ID="C1" NAME="C1" VALUE="YES">
<LABEL FOR="C1">Tady klikni</LABEL>

HTML kód nastavit jako domovskou stránku

 

<span><a href="#" onclick="document.body.style.behavior='url(#default#homepage)';document.body.setHomePage
(
'http://www.keli.websnadnocz/ ');return false;"><strong> Nastavit keli </strong> jako domovskou stránku</a></span>


Napiš si název stránky
Adresa stránky


Změna obrázku po najetí myší

<img src=" url prvního obrázku " onmouseover="this.src=' url druhého obrázku ';" onmouseout="this.src=' ZNOVU url prvního obrázku ';">
OBRÁZKY MUSÍ BÝT VE FORMÁTU .GIF !!!
Rolovací okno

<DIV STYLE="position:relative; width:400; height:120; top:0; left:50; background-color:lightyellow; overflow:scroll; border: 1px inset black; padding:10") ... vlastní text ... Bla bla bla ... </DIV>
Běhací písmo

K e l i ! !

<center>
<p align="center"><font size="+3" color="#FF0000"><marquee behavior="alternate" scrolldelay="65" width="12%">K</marquee><marquee behavior="alternate" scrolldelay="20" width="12%">e</marquee><marquee behavior="alternate" scrolldelay="60" width="12%">l</marquee><marquee behavior="alternate" scrolldelay="30" width="12%">i</marquee><marquee behavior="alternate" scrolldelay="50" width="12%">!</marquee><marquee behavior="alternate" scrolldelay="70" width="12%">!</marquee></font></center>

rychlost  písmen řídíš  čísly...tag pro barvu a centrování si taky upravíš jak chceš

HTML kód  na vložení videa

 

<embed src="Název videa + typ" width="300" height="250">


Změna pozadí v buňce

<a href="javascript:changeColor("AA","#FF0000")">Změnit barvu pozadí na červenou</a><br>

<a href="javascript:changeColor("AA","#00FF00")">Změnit barvu pozadí na zelenou</a>