MiniRepetytorium CSS

CSS
Kaskadowe arkusze stylów (ang. Cascading Style Sheets) to język służący do opisu formy prezentacji (wyświetlania) stron WWW opracowany przez organizację W3C. Obecnie obowiązującym standardem jest wersja CSS 2.1[1] oraz zatwierdzone moduły CSS3.

WSTĘP

Przykład 1.


Reguła
selektor { właściwość: wartość; }
Selektor
selektor
Deklaracja
właściwość: wartość;

Więcej:

Plansza http://plotkarka.eu/PI/css3/preludium.html

REGUŁY

Kolor tekstu i wartość kolor

  • {color:} - kolor tekstu,

Tło

  • {background:} - właściwości tła,
  • {background-attachment:} - sposób przewijania tła,
  • {background-color:} - kolor tła,
  • {background-image:} - tło graficzne elementu,

Fonty

  • {font:} - właściwości fontu,
  • {font-family:} - rodzaj fontu,
  • {font-size:} - wielkość fontu,
  • {line-height:} - interlinia

Więcej na:
Karta http://plotkarka.eu/KP/css3-fonts.html
Plansza http://plotkarka.eu/PI/css3-fonts/

Model Box

  • {width:} - szerokość elementu,
  • {height:} - wysokość elementu,
  • {margin:} - margines zewnętrzny,
  • {margin-top:} - margines zewnętrzny górny,
  • {padding:} - margines wewnętrzny,
  • {padding-top:} - margines wewnętrzny górny.

Więcej na:
Karta http://plotkarka.eu/KP/css3-box.html
Plansza http://plotkarka.eu/PI/css3-box/

Tekst

  • {text-align:} - wyrównywanie tekstu,
  • {text-indent:} - wcięcie pierwszego wiersza akapitu,
  • {letter-spacing:} - odstępy między literami,
  • {word-spacing:} - ostęp między wyrazami.

Więcej na:
Karta http://plotkarka.eu/PI/css3-text.html
Plansza http://plotkarka.eu/PI/css3-text/

Efekty tekstu

  • {text-decoration:} - wyróżnienia tekstu.

Więcej na:
Karta http://plotkarka.eu/KP/css-text-decor-3.html
Plansza http://plotkarka.eu/PI/css-text-decor-3/

Listy

  • {list-style:} - właściwości listy
  • {list-style-image:} - punktor graficzny listy

Więcej na:
Karta http://plotkarka.eu/KP/css-lists-3.html
Plansza http://plotkarka.eu/PI/css3-lists/

Selektory

  • Typu
  • Potomka i dziecka
  • Klasy i identyfikatora
  • ::first-letter - pierwszy znak,
  • :link - pseudoklasa linków,
  • :hover - pseudoklasa elementów wskazanych,
  • [] - atrybutu,

Wartości i jednostki

  • % - procent
  • px - piksel
  • pt - punkt

ŹRÓDŁA

[CSS21]
Bert Bos et al.; CSS 2.1; W3C Recommendation 7 June 2011;
URL: https://www.w3.org/TR/CSS2