CSS je Cascading Style Sheets.
Može se dodati na 3 načina u HTML dokument:
Korišćenjem style atributa unutar HTML elementa
Korišćenjem <style> taga unutar <head> sekcije
Korišćenjem <link> taga koji pokazuje na CSS fajl gde se piše CSS kod
Primer 1:
<h1 style="color:blue;">A Blue Heading</h1>
<p style="color:red;">A red paragraph.</p>
Primer 2:
<!DOCTYPE html>
<html>
<head>
<style>
body {background-color: powderblue;}
h1 {color: blue;}
p {color: red;}
</style>
</head>
<body>
<h1>This is a heading</h1>
<p>This is a paragraph.</p>
</body>
</html>
Primer 3:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<h1>This is a heading</h1>
<p>This is a paragraph.</p>
</body>
</html>
Imamo i fajl styles.css u sitom folderu sa sledećim sadržajem:
body {
background-color: powderblue;
}
h1 {
color: blue;
}
p {
color: red;
}
Primer 4: Podešavanje color, font-family, font-size:
<!DOCTYPE html>
<html>
<head>
<style>
h1 {
color: blue;
font-family: verdana;
font-size: 300%;
}
p {
color: red;
font-family: courier;
font-size: 160%;
}
</style>
</head>
<body>
<h1>This is a heading</h1>
<p>This is a paragraph.</p>
</body>
</html>
Primer 5: Podešavanje border-a:
p {
border: 2px solid powderblue;
}
Primer 6: Podešavanje padding-a
p {
border: 2px solid powderblue;
padding: 30px;
}
Primer 7: Podešavanje margine
p {
border: 2px solid powderblue;
margin: 50px;
}