CSS

Kaskadowe arkusze stylów (ang. Cascading Style Sheets, CSS) są językiem służącym do opisu sposobu renderowania stron WWW. CSS został wypracowany przez organizację W3C w 1996 r. jako potomek języka DSSSL przeznaczony do używania w połączeniu z SGML-em.

Arkusz CSS to lista dyrektyw (tzw. reguł) ustalających w jaki sposób ma być renderowany przez przeglądarkę tekst znajdujący się wewnątrz danego elementu HTML/XHTML/XML lub inna część składowa dokumentu opisywana przez dany element. Ustalać można w ten sposób wszystkie właściwości odpowiedzialne za wygląd elementów HTML, takie jak rodzaj czcionki tekstu, kolor, marginesy, odstęp międzywierszowy itp. a nawet pozycję danego elementu względem innych elementów lub całej strony. Wykorzystanie arkuszy stylów daje znacznie większe możliwości pozycjonowania elementów na stronie, niż oferuje sam HTML (W3C odradza używania elementów HTML odpowiedzialnych za wygląd strony).

Źródło: Wikipedia

Wstęp

Wstawianie stylów - Selektory - Pseudoklasy - Pseudoelementy - Elementy blokowe i liniowe - Model pudełkowy - Jednostki - Inherit - Media - Quirks mode - Treść generowana - Wsparcie przeglądarek

Czcionki

Font - Font-size - Font-family - Font-style - Font-weight - Font-variant - Font-stretch - Font-size-adjust

Tekst

Color - Text-decoration - Text-transform - Text-align - Vertical-align - Text-indent - Text-shadow - Line-height - Word-spacing - Letter-spacing - White-space - Text-overflow - text-overflow-mode - text-overflow-ellipsis

Tło

Background - Background-color - Background-image - Background-repeat - Background-position - Background-attachment - Background-clip - Background-origin - Background-size - background-break - Opacity

Marginesy

Box-sizing - Margin - Margin-top - Margin-bottom - Margin-left - Margin-right - Padding - Padding-top - Padding-bottom - Padding-left - Padding-right

Obramowanie

Border - Border-style - Border-color - Border-width - Border-image - Border-radius - border-break - border-fit - Border-bottom-color - Border-bottom-style - Border-bottom-width - Border-bottom - Border-left-color - Border-left-style - Border-left-width - Border-left - Border-right-color - Border-right-style - Border-right-width - Border-right - Border-top-color - Border-top-style - Border-top-width - Border-top - Outline - Outline-color - Outline-style - Outline-width

Wykazy

List-style - List-style-type - List-style-position - List-style-image

Rozmiary

Width - Height - Max-width - Min-width - Max-height - Min-height - Overflow - Resize

Tabele

Caption-side - Table-layout - Border-collapse - Border-spacing - Empty-cells

Pozycjonowanie

Position - Clip - Display - Visibility - Float - Clear

Kolumny tekstu

Column-width - Column-gap - Column-count - column-space-distribution - column-rule - column-rule-color - column-rule-style - column-rule-width

Związane z drukowaniem

Page-break-before - Page-break-after - Page-break-inside - Widows - Orphans

Inne

Cursor - Box-shadow

Praktyka

tworzenie layoutu bez użycia tabelek - tworzenie menu - ostylowanie formularzy - Propozycje

Specyfikacje

  • CSS 1
  • CSS 2
  • CSS 2.1
  • CSS 3 (trwają prace)

    Zobacz też

  • (X)HTML

    Linki zewnętrzne

  • CSSPlay - zaawansowane przykłady użycia CSS (ang.)
  • CSS Zend Garden - strony wykonane semantycznie w XHTML+CSS (ang.)
  • complexspiral demo - demo możliwości CSS (CSS 1 i odrobina CSS 2) (ang.)
  • CSS-Validator - sprawdza poprawność kodu CSS (ang.)
  • Acid 2 - jest to test poprawności wyświetlania stron internetowych zbudowanych za pomocą technologii HTML4 i CSS2

Narzędzia

Sprawdzone narzędzia do zarządzania plikami CSS oraz ich zawartością.(propozycja)

Hidden

  • 2009-04-15 16:50
  • 2 komentarzy
  • 2052 odsłony

Link

  • 2009-04-14 22:56
  • 0 komentarzy
  • 1820 odsłon

First-line

  • 2008-12-30 00:20
  • 1 komentarz
  • 1700 odsłon

First-letter

  • 2008-12-30 00:04
  • 0 komentarzy
  • 1721 odsłon

None

  • 2008-12-02 15:21
  • 0 komentarzy
  • 2010 odsłon

Visited

  • 2007-10-29 15:04
  • 1 komentarz
  • 649 odsłon

CSS1

  • 2007-05-30 12:27
  • 0 komentarzy
  • 1168 odsłon

Elementy blokowe i liniowe

  • 2007-05-28 16:27
  • 0 komentarzy
  • 2028 odsłon

Vertical-align

  • 2007-05-08 15:53
  • 0 komentarzy
  • 2352 odsłony

Page-break-before

  • 2007-05-08 13:35
  • 0 komentarzy
  • 398 odsłon

Page-break-inside

  • 2007-05-08 13:35
  • 0 komentarzy
  • 402 odsłony

Page-break-after

  • 2007-05-08 13:34
  • 0 komentarzy
  • 414 odsłon

Widows

  • 2007-05-08 13:33
  • 0 komentarzy
  • 390 odsłon

Orphans

  • 2007-05-08 13:32
  • 0 komentarzy
  • 368 odsłon

Box-shadow

  • 2007-05-08 13:30
  • 0 komentarzy
  • 2501 odsłon