<!DOCTYPE html> <html lang="pl"> <head> <meta charset="utf-8"> <title>strona główna</title> <meta name="keywords" content="słowa kluczowe"> <meta name="description" content="opis zawartości strony"> <meta name="author" content="imię i nazwisko autora, adres email"> <!--<link rel="stylesheet" type="text/css" href="styl.css">--> </head> <body> <div style="text-align:center; width:800px; margin-left:auto; margin-right:auto;"> <table border="0" cellspacing="0" cellpadding="0"> <tr style="background-color:#009900"> <td height="175" colspan="2"> </td> </tr> <tr> <td width="175" height="625" style="background-color:#ffff00"> </td> <td width="625" height="625" style="background-color:#ff0000"> </td> </tr> </table> </div> </body> </html>
Kopiujemy kod, wklejamy do edytora, w którym tworzymy stronę (np. Notatnika). Zapisujemy jako index.htm lub index.html i mamy gotowy szablon strony głównej naszej witryny internetowej. Po otwarciu strony w przeglądarce otrzymujemy nastepujący efekt:
<!DOCTYPE html> <html lang="pl"> <head> <meta charset="utf-8"> <title>strona główna</title><meta name="keywords" content="słowa kluczowe"> <meta name="description" content="Opis zawartości strony."> <meta name="author" content="Imię i nazwisko autora, adres email"> <!--<link rel="stylesheet" type="text/css" href="styl.css">--> <style type="text/css"> body { text-align:center; background-color:#FFFFFF; } #frame { width:800px; margin-right:auto; margin-left:auto; text-align:left; } #contentheader { height: 175px; background-color:#009900; } #contentleft { width:175px; height: 625px; float:left; background-color:#FFFF00; } #contentcenter { width:625px; height: 625px; float:left; background-color:#FF0000; } </style> </head> <body> <div id="frame"> <div id="contentheader"> <div> </div> </div> <div id="contentleft"> <div> </div> </div> <div id="contentcenter"> <div> </div> </div> </div> </body> </html>