Wymagania - CSS

Tworzenie stron internetowych

URL:: http://www.plotkarka.eu/pomoce/css-wymagania.html
Autor:: Radosław Kowaluk

Formatowanie stron internetowych
Moduł	Opanowanie pamięciowe	Opanowanie operacyjne	Rozszerzenie
Wstęp do CSS
Atrybut style
Wartości i jednostki	px, %	pozostałe jednostki	Nowe jednostki
Kolor	`{color:}`, Modele kolorów	Modele kolorów	`{opacity:}`
Selektory	prosty (elementu) i atrybutu, pseudoklasy hiperłączy, grupowanie selektorów, Selektor klasy i identyfikatora	Reguły: @page, @media, @import. Pseudoklasy i pseudoelementy. Selektor potomka i dziecka, Selektor braci i rodzeństwa, Selektor uniwersalny.	Nowe selektory
Kaskadowość i dziedziczenie
Typy mediów	Typy mediów	Reguły warunkowe	Techniki RWD
Box model	`{display:}`, `{margin:}`, `{padding:}`, `{width:}`, `{height:}`, `{float:}`, `{clear:}`	`{max-width:}`, `{min-width:}`, `{max-height:}`, `{min-height:}`, `{margin-top:}`, `{margin-right:}`, `{margin-bottom:}`, `{margin-left:}`, `{padding-top:}`, `{padding-right:}`, `{padding-bottom:}`, `{padding-left:}`, `{visibility:}`, `{overflow:}`	`{overflow-x:}`, `{overflow-y:}`
Pozycjonowanie		`{position:}`, `{top:}`, `{right:}`, `{bottom:}`, `{left:}`, `{z-index:}`, `{clip:}`
Listy	`{list-style:}`	`{list-style-type:}`, `{list-style-position:}`, `{list-style-image:}`
Generowanie treści		`{content:}`, `{counter-increment:}`, `{counter-reset:}`, `{quotes:}`
Drukowanie		Reguła @page {} `{page-break-before:}`, `{page-break-after:}`, `{page-break-inside:}`, `{widows:}`, `{orphans:}`	@page :first {}, @page :left {}, @page :right {}
Tło i obramowanie	`{background:}`, `{border:}`	`{background-color:}`, `{background-image:}`, `{background-attachment:}`, `{background-repeat:}`, `{background-position:}`, `{border-width:}`, `{border-style:}`, `{border-color:}`
Tekst	`{text-align:}`	`{text-indent:}`, `{text-transform:}`, `{letter-spacing:}`, `{word-spacing:}`, `{white-space:}`
Efekty tekstu	`{text-decoration:}`		`{text-shadow:}`
Fonty	`{font:}`	`{font-style:}`, `{font-variant:}`, `{font-weight:}`, `{font-size:}`
Line model		`{line-height:}`, `{vertical-align:}`
Tabele	`{border-collapse:}`	`{table-layout:}`, `{caption-side:}`, `{empty-cells:}`, `{border-spacing:}`
Interfejs użytkownika		`{cursor:}`, `{outline:}`, `{outline-width:}`, `{outline-style:}`, `{outline-color:}`

Formatowanie struktur

Strona internetowa

body {
width: szerokość_strony px;
margin: auto;
}
header, nav, main, aside, footer {
border: 1px solid;
margin: 2px 1px;
padding: 2px;
}
nav, main, aside {
float: left;
}
nav {

}
main {

}
aside {

}
footer {
clear: left;
}