Sunday, March 28, 2021

CSS u HTML

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;
}
{
  color: red;
}

Primer 4: Podešavanje colorfont-familyfont-size:

<!DOCTYPE html>
<html>
<head>
<style>
h1 {
  color: blue;
  font-family: verdana;
  font-size: 300%;
}
{
  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:

{
  border: 2px solid powderblue;
}

Primer 6: Podešavanje padding-a

{
  border: 2px solid powderblue;
  padding: 30px;
}

Primer 7: Podešavanje margine

{
  border: 2px solid powderblue;
  margin: 50px;
}

No comments:

Post a Comment

CSS u HTML

CSS je Cascading Style Sheets. Može se dodati na 3 načina u HTML dokument:     Korišćenjem  style  atributa unutar HTML elementa     Korišće...