Vaihtaa taustan väriä sen mukaan minkä väri koodin pistät.
background-color:#ff0000
2.font size
Vaihtaa tekstin fontti kokoa
<p style="font-size:20px;">This text is using a font size of 20 pixels.</p>
3.relative positioning
Voit päättää minne esim jokin teksti menee. Esim meneekö reunaan muista vai keskelle
<p>moro</p>
<div style="position:relative;left:50px;background-color:yellow;width:90px;">
Tämä on keskellä.
</div>
<p>moro</p>
4.layers
Voit laittaa asioita päällekkäin
<div style="background-color:red;width:80px;height:100px;position:relative;top:10px;left:80px;z-index:2;">
</div>
<div style="background-color:yellow;width:80px;height:100px;position:relative;top:-60px;left:35px;z-index:1;">
</div>
5.font-family
Laitat fontteja siltä varalta jos joku selain ei tunnista jotain fonttia
<p style="font-family:georgia,garamond,serif;">
6.Text-shadow
määrittää tekstille varjon
h1{
text-shadow: 4px 4px 6px red
}
6.Empty-cells
Määrittää näytettäänkö tyhjät lokerot
table {
empty-cells: hide, show, inherit;
}
7.volume
Jos sivulla on musiikkia tämä määrittää kuinka kovalla se on
h1{
volume: 50;}
8.outline
Määrittää reunukset
p {
outline: thick solid red
}
9.margin
siirtää koko teksti laattikkoa
p {
padding-top: 50px; (ylä 50px)
padding-bottom: 50px; (ala 50px)
padding-right: 50px; (oikea 50px)
padding-left: 50px; (vasen 50px)
}
10.boarder
Voi tehä laattikon tekstin ympärille
div.styled {
border:2px dotted #ff0000;
}
<div class="styled">
11.white-space
määritettään rivin vaihto
p {
white-space: nowrap, normal, pre, inherit;
}
12.float
määrittää onko teksti oikealla vai vasemalla
h1{
float: left
}
13.padding
Siirtää tekstiä laatikon sisällä
p {
padding-top: 50px;
padding-bottom: 50px;
padding-right: 50px;
padding-left: 50px;
}
14.color
määrittää taustan tai fontin tekstin
h1{
color: red;
color: #ff0000;
}
15.font variant
pystyt pistään tekstiin esim joka sanan ekan kirjaimen isoksi.
<p style="font-variant:small-caps;">This Text Is Using Small Caps.</p>
16.wildth
Määrittää jonkin objektin tai tekstin leveyden
width: 20%;
17.height
Määrittäää jonkin objektin tai tekstiin korkeuden
18.position
Määrittää objektin tai tekstin asettamis tavan. esim kuva voidaan laittaa liikkumaan mukana vaikka rullaat sivua.
- position: stati, absolute, fixed,relative;
19word-spacink
Määrittää valkoisen alueen kirjainten väliin
- word-spacing: normal | length;
20.word-wrap
Sallii pitkien tekstien pakollisen rivin vaihdon
word-wrap: normal | break-word;
Ei kommentteja:
Lähetä kommentti