txt files: Ako vytvoriť web stránku :ssjh Bardejov

1. Otvorte poznámkový blok a napíšte základnú štruktúru HTML dokumentu.

Základná štruktúra HTML dokumentu.

<!DOCTYPE HTML>
<html>
<head>
<title> </title>
</head>

<body>

</body>
</html>

Vysvetite čo sú tágy (značky), skratka HTML, tágy head, title, body, párový, nepárový, font, br, pre, div, table, tr, td,

2. Dopíšte do tela stránky texty, ktoré sú červené.

<!DOCTYPE HTML>
<html>
<head>
<title> Môj Blog </title>
</head>

<body>
Som študentom Spojenej školy
 
Juraja Henischa

v Bardejove.
</body>
</html>

3. Zmeňte farbu textu Juraja Henischa na modrú a v Bardejove na oranžovú.

<!DOCTYPE HTML>
<html>
<head>
<title> Môj Blog </title>
</head>

<body>
Som študentom Spojenej školy 
<font color=blue>Juraja Henischa</font> 
<font color=orange>v Bardejove</font>.
</body>
</html>

4. V poznámkovom bloku uložte na pracovnú plochu súbor ako s názvom blog.html a otvorte ho v prehliadači www.

5. Zameňte štyl písma na helvetica a veľkosť 36 px.

<!DOCTYPE HTML>
<html>
<head>
<title> Môj Blog </title>
</head>

<body>
Som študentom Spojenej školy 
<font style=font-family:helvetica; color:blue; font-size:36px;>Juraja Henischa</font> 
<font style=font-family:helvetica; color:blue; font-size:36px;>v Bardejove</font>.
</body>
</html>

6. Pridajte názov-titulok Môj Blog s formatovaním h1 pomocou css - kaskádového štýlu a novým písmom Eldiablo z adresy http://ssjh.sk/txt/src/eldiablo.ttf a centrovaním.

6.1 na ploche vytvorte súbor mystyle.css s obsahom

 @font-face { font-family: 'Eldiablo'; src: url(http://ssjh.sk/txt/src/eldiablo.ttf); }

6.2 do súboru blog.html pridajte za title

<link rel="stylesheet" href="mystyle.css">

6.3 za body dopíšte

<h1><font style="font-family:Eldiablo;">Môj Blog</font></h1>

6.4 Farba pozadia na silver, dopíšte za body

<body bgcolor=silver>

7. Ako pridať linku na text?

Naformatujte linku/odkaz http://ssjh.sk na titulok môj blog

<h1><a href="http://ssjh.sk"><font style="font-family:Eldiablo;">Môj Blog</font></a></h1>

8. Ako pridať obrázok?

<img src="http://ssjh.sk/news/images/FrantisekHaluska16.jpg ">

<img src="FrantisekHaluska16.jpg" alt="aiX" title="aIx">

<img src="obrazky/FrantisekHaluska16.jpg" alt="aiX" title="aIx">

9. Ako pridať linku na obrázok?

<a href=www1.html><img src="FrantisekHaluska16.jpg" alt="aiX" title="aIx"></a>

Úloha č. 1

Vytvorte dve stránky 1.www.htm a 2.www.htm.

a) 1.www.htm

Môj profil - cervený text, hlavička s formátovaním h1

Som žiakom SSJH Bardejov - modrý text, text s formatovaním p.

b) 2.www.htm

Mesto Bardejov - zelený text, hlavička s formátovaním h1

Škola je v meste Bardejov - modrý text, text s formatovaním p.

c) Dokumenty prepojte, vytvorte linku v dokumente 1.www.htm s odkazom na 2.www.htm a opačne.
Ako linku použite slovo Bardejov v modrom texte.

Výsledok v prehliadači

Úloha č.2

Ako urobiť tabuľku Rozvrh Hodín?

a) pre

b) table

<table bgcolor=silver cellpadding=10>
<tr>

<td width=200> DEŇ/HODINA <td>
<td> 1 <td>
<td> 2 <td>
<td> 3 <td>
<td> 4 <td>
<td> 5 <td>
<td> 6 <td>
<td> 7 <td>

</tr>

<tr>

<td> PONDELOK <td>
<td> SJL <td>
<td> MAT <td>
<td> POG <td>
<td> TVP <td>
<td> TVP <td>
<td> TVP <td>
<td> ANJ <td>

</tr>

<tr>

<td> UTOROK <td>
<td> <td>
<td> <td>
<td> <td>
<td> <td>
<td> <td>
<td> <td>
<td> <td>

</tr>

<tr>

<td> STREDA <td>
<td> <td>
<td> <td>
<td> <td>
<td> <td>
<td> <td>
<td> <td>
<td> <td>

</tr>

<tr>

<td> ŠTVRTOK <td>
<td> <td>
<td> <td>
<td> <td>
<td> <td>
<td> <td>
<td> <td>
<td> <td>

</tr>

<tr>

<td> PIATOK <td>
<td> <td>
<td> <td>
<td> <td>
<td> <td>
<td> <td>
<td> <td>
<td> <td>

</tr>

</table>