Властивості області розміщення елемента
| Ім'я | Значення | Примітка |
| Margin | <число><розмірність > або <число>% або auto | Розмірність – px , in, cm , mm, pc пікселі, дюйми, см, мм, пункти. Наприклад, 25mm; % від базового розміру |
| Padding | ||
| Border-width | ||
| Border-color | Black, coral, orange, і так далі або через rgb | #rrggbb (наприклад, #00cc00 ) rgb(x,x,x), де х=0...255, rgb(x%,x%,x%), де х=0.0...100.0 |
| Border-style | None, dotted, dashed, solid, double, groove, ridge, inset, outset | Різні варіанти рамок: відсутня, пунктирна, штрихова і так далі |
До пункту 3.
Рядкові елементі (display= inline) відображається як вбудований в рядок, вміст елементів починається з того місця, де закінчився попередній.
До елементів із значенням list-item можна додавати таки властивості (таблиця 11).
Таблиця 11
Таблиця властивостей елементів з display=list-item
| Ім'я | Значення | Примітка |
| list-style | <набір значень> | узагальнена властивість |
| list-style-image | url ("шлях"), none | зображення маркера |
| list-style-position | outside, inside | розміщення маркера |
| list-style-type | disc, circle, square ... | вид маркера |
До пункту 4.
При форматуванні тексту можна керувати, як відображенням літер (таблиця 12), так і тексту в целому (таблиця 13).
Таблиця 12
Властивості шрифтів
| Ім'я | Значення | Примітка |
| font | <набір значень> | узагальнена властивість |
| font-family | <список імен> | список імен шрифтів або сімейств |
| font-size | число, число %, число і ед. изм., xx-small, x-small, small .... | розмір шрифту |
| font-style | normal, italic, oblique | зображення шрифту |
| font-variant | normal, small-caps | представлення рядкових букв |
| font-weight | normal, bold, bolder, lighter, 100, 200 ... | насиченість шрифту |
Таблиця 13
Властивості тексту
| Ім'я | Значення | Примітка |
| letter-spacing | <число>, normal | інтервал між символами |
| line-height | <число>, <число>%, normal | міжрядковий інтервал |
| text-align | left, right, center, justify | горизонтальне вирівнювання |
| text-decoration | none, underline, overline, line-through, blink | варіант оформлення |
| text-indent | <число>, <число>% | відступ першого рядка |
| vertical-align | baseline, sub, super, top-text, top, middle, bottom, bottom-text, <число>% | вирівнювання по вертикалі щодо батька або навколишнього тексту |
| word-spacing | <число>, normal | інтервал між словами |
До пункту 5.
Класовий селектор складається з імені тега і імені класу, з'еднаних крапкою. Наприклад, для тегу <H1 CLASS="bl">TEXT</H1> можуть бути:
H1.bl {color:blue; size:20pt}
.bl {color:blue}
ID селектор починається з символу #. Наприклад, для тегу <H1 ID="rd">TEXT</H1>:
#rd {color:blue; size:20pt}
У тегі обидва атрибути (CLASS і ID) можуть використовуватися одночасно, довизначаючи стиль елементу.
Контекстні селекторискладаються з простих селекторів, розділених пропуском (всі описувані до цього селектори були простими селекторами). Вони застосовуються до елементів, зв'язаних спадковими стосунками і задають властивості тільки конкретного дочірнього елементу.
OL LI {list-style-type: decimal}
UL LI { list-style-type: square}
При використанні таких правил елементи в нумерованому списку (OL) матимуть один стиль, а в ненумерованому (UL) – інший.
Контекстні селектори можуть містити тип елементу, атрибути CLASS, атрибути ID або їх комбінацію:
DIV P { font: small sans-serif }
.reddish H1 { color: red }
#x78y CODE { background: blue }
DIV.sidenote H1 { font-size: large }
Псевдокласи розрізняють типи одного елементу (наприклад, посилання в різних станах, активна, вже відвідувалася, ще не відвідувалася), створюючи при визначенні власні стилі для кожного з них. Наприклад, псевдокласи елементу <а href=" "> :
link (посилання), active (активне посилання), visited (відвіданий раніше URL), hover (псевдоклас, що виникає при тому, що піднесло курсору до посилання).
a:link,a:visited {color:blue} - відвіданий раніше URL
a:active {color:red} - активне посилання
a:hover {text-decoration:none} - псевдоклас, що виникає при наведенні курсору до посилання.
Псевдоелементи є частями інших елементів, задаючи цим частинам відмінний від елементу в цілому стиль (наприклад, перший рядок в абзаці або перша літера рядка):
P:first-line {color: purple }
H1:first-letter { color: red }.