Skip to content

Latest commit

 

History

History
122 lines (99 loc) · 1.89 KB

03.md

File metadata and controls

122 lines (99 loc) · 1.89 KB
Raw

Vežbe | 3. termin

CSS

Povezivanje HTML i CSS koda

Inline

<p style="color: red;">
    Lorem ipsum ...
</p>

Style tag

<head>
    <style>
        /* CSS kod */
        p {
            color: red;
        }
    </style>
</head>
<body>
    <p>Lorem ipsum ...</p>
</body>

CSS file

index.html

<head>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <p>Lorem ipsum ...</p>
</body>

style.css

p {
    color: red;
}

Sintaksa

Selektorom biramo (selektujemo) na koje/kakve elemente želimo da primenimo blok sa naredbama.

selektor {
    /* Naredbe */
}

Selektori (Osnove)

Sintaksa za izbor elemenata:

  • tag - Izbor svih elemenata datog tipa 
    p { } /* svi paragraf elementi */
h1 { } /* svi heading 1 elementi */
  • .class - Izbor svih elemenata sa datom klasom 
    .klasa1 { } /* svi elementi sa klasom "klasa1" */
.tamni-tekst { } /* svi elementi sa klasom "tamni-tekst" */
  • #id - Izbor elementa sa datim id-jem 
    #copyright-tekst { } /* element sa id-jem "copyright-tekst" */
#glavni-paragraf { } /* element sa id-jem "glavni-paragraf" */

Background

  • background-color
  • background-image
  • background-repeat
  • background-position
  • background-attachment
  • background-size

Text & Font

  • color
  • line-height
  • text-aligh
  • text-indent
  • text-decoration
  • font-size
  • font-style
  • font-weight
  • font-family
  • font-variant
  • letter-spacing

Box Model

  • Size
    • width
    • height
    • min-height
  • Border
    • border
    • border-style
    • border-width
    • border-color
    • border-top-* (bottom, left, right)
  • Margin
    • margin
    • margin-top (bottom, left, right)
  • Padding
    • padding
    • padding-top (bottom, left, right)