Erinevus lehekülje "CSS" redaktsioonide vahel

Allikas: Kuutõrvaja
(Süntaks)
(Rakendamine)
18. rida: 18. rida:
 
= Rakendamine =
 
= Rakendamine =
  
Rakendamiseks on 2 võimalust:
+
Rakendamiseks on 3 võimalust:
  
 
* Defineerida CSS stiilid veebilehe sees
 
* Defineerida CSS stiilid veebilehe sees
34. rida: 34. rida:
 
<source lang="html4strict">
 
<source lang="html4strict">
 
<link rel="stylesheet" href="css/minucss.css" type="text/css" media="screen" />
 
<link rel="stylesheet" href="css/minucss.css" type="text/css" media="screen" />
 +
</source>
 +
 +
* Lisada elemendi sisse vastav CSS kood
 +
 +
<source lang="html4strict">
 +
<div style="padding: 5px; border: 1px solid #aaa;">Kasti sisu...</div>
 
</source>
 
</source>
  

Redaktsioon: 25. jaanuar 2011, kell 09:07

CSS e. Cascading Style Sheet on viis, kuidas kiirelt, efektiivselt ja minimaalse vaevaga kujundada HTML veebileht.

Eeldused

Enne selle teema lugemist tuleks HTML põhitõed endale selgeks teha.

Süntaks

 selector [, selector2, ...][:pseudo-class] {
   property: value;
   [property2: value2;
   ...]
 }
 /* kommentaar */

Kõiki ekraanil kuvatavaid HTML elemente saab CSS'iga kujundada, kagu ka omistada neile ID atribuudi, mistõttu on nende poole kergem pöörduda.

Rakendamine

Rakendamiseks on 3 võimalust:

  • Defineerida CSS stiilid veebilehe sees
<style>

/* stiilide defineerimine */

</style>
  • Luua eraldi fail CSS stiilide kirjeldusega ja viidata sellele veebilehe päises
<link rel="stylesheet" href="css/minucss.css" type="text/css" media="screen" />
  • Lisada elemendi sisse vastav CSS kood
<div style="padding: 5px; border: 1px solid #aaa;">Kasti sisu...</div>

Näited =

TODO

Veebilehe body elemendi taustavärvi muutmiseks.

body {

 background-color: #d0e4fe;

}

asd