20 Tärkeintä CSS Parametrit
1. font-family
Määrittää fontin tai fonttiperheen.
2. font-size
Määrittää fontin koon
3. font-style
Määrittää onko teksti lihavoitu, kursivoitu tai alleviivattu.
4. text-align
Määrittää missä teksti on esim text-align: center on keskellä.
5. vertical-align
Käytetään esim. kuvan siirtämisessä tekstin viereen asiallisen näköisesti.
6. div {
display: none;
}
piilottaa elementin.
7. div {
margin X: X px;
}
määrittää elementtien välin nettisivulla.
8. div {
border: px
/* border width style, color */
}
määrittää sivun reunukset.
9. Float
Mahdollistaa sivupalkin tekemisen
10. background-color
määrittää nettisivun taustan värin
11. background-image
kuva taustalle.
12. background-position
määrittää missä taustasi on ja paljonko se peittää, peittääkö koko taustan vai vaan puolet.
13. a.toggler {color:
}
muuttaa kaikki linkit haluamasi värin mukaan
14. text-decoration
muokataan millä teksti näyttää.
15. h1 { color: red
}
määrittää minkä värinen h1 elementti on
16. text-transform
voidaan käyttää muokkaamaan tekstiä esim pienet kirjaimet isoiksi.
17. text-shadow
voidaan käyttää laittamaan tekstiin varjostus.
18. direction
määrittää mihin suuntaan teksti luetaan esim oikealta vasemmalle tai vasemmalta oikealle.'
19. font-weight
määrittää fontin painon
20. td {
padding: 15px
}
määrittää tekstin välin reunaa nähden.
keskiviikko 11. maaliskuuta 2015
Tutoriaali
Kynä tutoriaali.
1. Aloita menemällä File > New ja vaihda väreiksi värit RGB
2. Tee neliö Rectangle Toolilla.
3. Tee kynän terä tekemällä rectangle ja lisäämällä siihen ankkuri keskelle sivureunaa että siitä tulee kolmio kun poistat 2 kulma ankkuria, tee myös toinen mutta pienempi ja laita se päälimmäiseksi painamalla hiiren oikeaa painiketta ja valitsemalla valikosta "Arrange" ja siitä "Bring to Front".
Käytä kumin tekemiseen rectangle toolin rounded rectanglea jonka saat painamalla rectangle toolia hiiren oikealla painikkeella, poista rounded rectanglesta 2 vasemmanpuoleisinta ankkuria pen-toolilla.
Tee siihen päälle vielä yksi pienempi suorakulmio tälläkertaa normaalilla rectangle toolilla.
4. Värit
Mene colorpickeriin kaksoisklikkaamalla värilaatikkoa työkalupalkin alareunassa.
Valitse kynän värit kuvan malliin.
5. Tee väreistä suunnilleen tämän laiset liukuvärit, voit vaihtaa liukuvärin väriä kaksoisklikkaamalla tuota pientä liukuväri slideriä, lisää liukuväri slidereitä painamalla jostain kohtaa liukuväriä.
6. Lopuksi tee vielä yksi rounded rectangle ja laita se kynän yläreunaan näin.
7. Lisää valkoiseen rounded rectangleen läpinäkyvyyttä menemällä gradient valikkoon ja siitä klikkaat transparency välilehteä, laita transparency 25%.
8. Kynä on valmis.
torstai 5. maaliskuuta 2015
Koodin korjaaminen
<html>
<head>
<title>Oma sivu</title>
<meta charset="UTF-8”>
</head>
<body bgcolor="#DB7093"> <h1>Kokeilu</h1><br> lisää tekstiä<br> vielä lisää tekstiä <p><font face="arial" color="#6B4226"> <b>uusi kappale</b></font> <table border="1" width="900" align="center"> <tr> <th colspan="3">eka solu</th> <tr> <td width="100">kolmas solu</td> <td width="500">neljäs solu</td> <td width="300">b solu</td> </tr> </table> <br> <table border="1" width="900" align="center"> <tr> <td width="100">eka solu</td> <th rowspan="2">otsikkosolu</th> <td width="300">a solu</td> </tr> <tr> <td width="100">kolmas solu</td> <td width="300">b solua</td> </tr> </table> <p> <a href="http://www.kktavastia.fi" target="_blank"> <img ="kuvia/koulu_valmis.jpg" alt="Koulun sivuille"> </a> </p> <p> <a href="http://www.kktavastia.fi" target="_blank">Koulun sivut</a> </p> <p> <a href="toka.html" target="_self"> <img src="kuvia/painike.jpg" alt="Toiselle sivulle"> </a> </p> <p> <a href="kolmas.html" target="_self"> <img src=""kuvia/painike2.jpg" alt="Kolmannelle sivulle"> </a> </p> </body> </html>
Tilaa:
Blogitekstit (Atom)