Vienkāršie piemēri

HTML bez CSS

HTML kods
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">
<html>

<head>
  <title>CSS piemērs1</title>
  <meta http-equiv="Content-Type"
        content="text/html; charset=windows-1257">
</head>

<body>

<h1>Pirmā līmeņa virsraksts</h1>

<h2>Otrā līmeņa virsraksts</h2>

<h3>Trešā līmeņa virsraksts</h3>

<p>Teksts rindkopā</p>

<table>
  <tr>
    <th>Tabulas galva 1</th>
    <th>Tabulas galva 2</th>
  </tr>

  <tr>
    <td>Tabulas dati 1</td>
    <td>Tabulas dati 2</td>
  </tr>
</table>

<ul>
  <li>Teksts sarakstā 1</li>
  <li>Teksts sarakstā 2</li>
  <li>Teksts sarakstā 3</li>
</ul>

</body>
</html>
Rezultāts

piem1bez_css.html

CSS piemērs 1

CSS kods
/* CSS stilu definīcija */

body {
       color       : red;
       font-family : "Time New Roman";
       bgcolor     : "EEEEEE";
       font-size   : 14 pt
     }

h1 {
     color : blue
   }

h2 {
     color : black
   }

h3 {
     color : green
   }
HTML koda daļa
...
  <link rel="stylesheet" type="text/css" href="stils1.css">
</head>
...
Rezultāts

piem1ar_css1.html

CSS piemērs 2

CSS kods
/* CSS stilu definīcija */

body {
       color       : red;
       font-family : "Arial";
       bgcolor     : "EEEEEE";
       font-size   : 14 pt
     }

h1 {
     color : green
   }

h2 {
     color : blue
   }

h3 {
     color : black
   }
HTML koda daļa
...
  <link rel="stylesheet" type="text/css" href="stils2.css">
</head>
...
Rezultāts

piem1ar_css2.html