CSS opetusohjelma


Sisällysluettelo

    Näytä sisällysluettelo

CSS on kieli, jota käytämme HTML-dokumentin tyyliin.

CSS kuvaa kuinka HTML-elementit tulee näyttää.

Tämä opetusohjelma opettaa sinulle CSS:n perusasioista edistyneeseen.


Esimerkkejä jokaisessa luvussa

Tämä CSS-opetusohjelma sisältää satoja CSS-esimerkkejä.

Online-editorillamme voit muokata CSS:ää ja tarkastella tulosta napsauttamalla painiketta.

CSS-esimerkki

body
{
  background-color: lightblue;
}

h1
{
  color: white;
  text-align: center;
}

p
{
   
font-family: verdana;
  font-size: 20px;
}

Kokeile itse →

<!DOCTYPE html>
<html>
<head>
<style>
body {
  background-color: lightblue;
}

h1 {
  color: white;
  text-align: center;
}

p {
  font-family: verdana;
  font-size: 20px;
}
</style>
</head>
<body>

<h1>My First CSS Example</h1>
<p>This is a paragraph.</p>

</body>
</html>


Napsauta "Kokeile itse" -painiketta nähdäksesi, miten se toimii.


CSS-esimerkkejä

Opi yli 300 esimerkistä! Editorillamme voit muokata CSS:ää ja napsauttaa a -painiketta nähdäksesi tuloksen.

Siirry CSS-esimerkkeihin!


Käytä valikkoa

Suosittelemme lukemaan tämän opetusohjelman valikossa mainitussa järjestyksessä.

Jos sinulla on suuri näyttö, valikko on aina vasemmalla.

Jos näyttösi on pieni, avaa valikko napsauttamalla ylävalikon merkkiä .


CSS-malleja

Olemme luoneet joitain responsiivisia W3.CSS-malleja, joita voit käyttää.

Voit vapaasti muokata, tallentaa, jakaa ja käyttää niitä kaikissa projekteissasi.

Ilmaiset CSS-mallit!