Pułapka na spamerów



Style kaskadowe CSS


Kaskadowe arkusze stylów - tablica najbardziej popularnych właściwości.

Przykłady użycia stylów opisane są w kursie CSS


Właściwości tła


CSS Background Properties
Właściwość Opis możliwe wartości Przykłady
background-attachment Definiuje czy obrazek tła przewija się razem ze stroną, czy stoi nieruchomo. fixed
scroll
div { background-attachment:fixed; }

div { background-attachment:scroll; }

background-color Deklaracja koloru tła Nazwy kolorów RGB lub kolor w zapisie szesnastkowym. div { background-color:green; }

div { color:#00FF00; }

background-image Deklaracja obrazka jako tło trony. adres URL div { background-image:url(images/img.jpg); }

body { background-image:url(img.jpg); }

background-position Deklaracja pozycji obrazka tła. Lengths or percentages for the x and y positions, or one of the predefined values:

top left
top center
top right
center left
center center
center right
bottom left
bottom center
bottom right

div { background-position:10px 50px; }

div { background-position:bottom right; }

background-repeat Deklaracja sposobu powtarzania obrazka w tle strony. repeat
repeat-x
repeat-y
no-repeat
div { background-repeat:repeat-x; }

div { background-repeat:no-repeat; }

background Właściwości tła Oddzielone spacją wartości w kolejności (te, które nie są określone przyjmą wartość domyślną lub dziedziczoną):

background-color
background-image
background-repeat
background-attachment
background-position

div { background:green url(image.jpg) no-repeat fixed center center; }

div { background:url(image.jpg) fixed; }


Właściwości krawędzi


CSS Border Properties
Właściwość Opis możliwe wartości Przykłady
border-top-color Deklaracja koloru górnej krawędzi Nazwy kolorów RGB lub ich oznaczenia szesnastkowe lub domyślnie przeźroczyste.  div { border-top-color:green; }

div { border-top-color:#00FF00; }

border-top-style Deklaracja stylu górnej krawędzi none
hidden
dotted
dashed
solid
double
groove
ridge
inset
outset
div { border-top-style:solid; }

div { border-top-style:inset; }

border-top-width Deklaracja grubości górnej krawędzi Grubość wyrażona w trzech predefiniowanych wartościach:

thin
medium
thick

div { border-top-width:2px; }

div { border-top-width:thin; }

border-top Skrócona forma podania wszystkich właściwości górnej krawędzi. Wartości oddzielone spacją według kolejności (te, które nie są określone przyjmą wartość domyślną lub dziedziczoną):

border-top-width
border-top-style
border-top-color

div { border-top:2px solid green; }

div { border-top:thick double #00FF00; }

border-right-color Deklaracja koloru prawej krawędzi Nazwy kolorów RGB lub ich oznaczenia szesnastkowe lub domyślnie przeźroczyste.  div { border-right-color:green; }

div { border-right-color:#00FF00; }

border-right-style Deklaracja stylu prawej krawędzi none
hidden
dotted
dashed
solid
double
groove
ridge
inset
outset
div { border-right-style:solid; }

div { border-right-style:inset; }

border-right-width Deklaracja grubości prawej krawędzi Grubość wyrażona w trzech predefiniowanych wartościach:

thin
medium
thick

div { border-right-width:2px; }

div { border-right-width:thin; }

border-right Skrócona forma podania wszystkich właściwości prawej krawędzi. Wartości oddzielone spacją według kolejności (te, które nie są określone przyjmą wartość domyślną lub dziedziczoną):

border-right-width
border-right-style
border-right-color

div { border-right:2px solid green; }

div { border-right:thick double #00FF00; }

border-bottom-color Deklaracja koloru dolnej krawędzi Nazwy kolorów RGB lub ich oznaczenia szesnastkowe lub domyślnie przeźroczyste.  div { border-bottom-color:green; }

div { border-bottom-color:#00FF00; }

border-bottom-style Deklaracja stylu dolnej krawędzi none
hidden
dotted
dashed
solid
double
groove
ridge
inset
outset
div { border-bottom-style:solid; }

div { border-bottom-style:inset; }

border-bottom-width Deklaracja grubości dolnej krawędzi Grubość wyrażona w trzech predefiniowanych wartościach:

thin
medium
thick

div { border-bottom-width:2px; }

div { border-bottom-width:thin; }

border-bottom Skrócona forma podania wszystkich właściwości dolnej krawędzi. Wartości oddzielone spacją według kolejności (te, które nie są określone przyjmą wartość domyślną lub dziedziczoną):

border-bottom-width
border-bottom-style
border-bottom-color

div { border-bottom:2px solid green; }

div { border-bottom:thick double #00FF00; }

border-left-color Deklaracja koloru lewej krawędzi Nazwy kolorów RGB lub ich oznaczenia szesnastkowe lub domyślnie przeźroczyste.  div { border-left-color:green; }

div { border-left-color:#00FF00; }

border-left-style Deklaracja stylu lewej krawędzi none
hidden
dotted
dashed
solid
double
groove
ridge
inset
outset
div { border-left-style:solid; }

div { border-left-style:inset; }

border-left-width Deklaracja grubości lewej krawędzi Grubość wyrażona w trzech predefiniowanych wartościach:

thin
medium
thick

div { border-left-width:2px; }

div { border-left-width:thin; }

border-left Skrócona forma podania wszystkich właściwości lewej krawędzi. Wartości oddzielone spacją według kolejności (te, które nie są określone przyjmą wartość domyślną lub dziedziczoną):

border-left-width
border-left-style
border-left-color

div { border-left:2px solid green; }

div { border-left:thick double #00FF00; }

border-color Deklaracja koloru wszystkich krawędzi Nazwy kolorów RGB lub ich oznaczenia szesnastkowe lub domyślnie przeźroczyste. 

Kolor każdej krawędzi oddzielony spacją, deklaracja koloru krawędzi w następującej kolejności:

border-top-color
border-right-color
border-bottom-color
border-left-color

Wartości niezdeklarowane przyjmują zapis uproszczony.  Jeśli podany jest tylko jeden kolor, to będzie zastosowany do wszystkich czterech krawędzi. Jeśli podane są dwa kolory, to pierwszy jest dla dolnej i górnej krawędzi, a drugi dla lewej i prawej.  Jeśli podane są tylko trzy kolory to pierwszy dotyczy górnej krawędzie, drugi prawej i lewej, a trzeci dolnej krawędzi.

div { border-color:green red blue olive; }

div { border-color:green; }

div { border-color:green red; }

div { border-color:green red blue; }

border-style Deklaracja stylu wszystkich krawędzi none
hidden
dotted
dashed
solid
double
groove
ridge
inset
outset

Wartości niezdeklarowane przyjmują zapis uproszczony.  Jeśli tylko jeden styl jest podany to dotyczy on wszystkich czterech krawędzi. Jeśli dwa style są podane, to pierwszy dotyczy górnej i dolnej krawędzi, a drugi prawej i lewej. Jeśli podane są trzy style to pierwszy dotyczy górnej krawędzi, drugi prawej i lewej, a trzeci dolnej krawędzi

div { border-style:solid dotted dashed double; }

div { border-style:solid; }

div { border-style:solid dotted; }

div { border-style:solid dotted dashed; }

border-width Deklaracja grubości wszystkich krawędzi Grubość wyrażona w trzech predefiniowanych wartościach:

thin
medium
thick

Wartości niezdeklarowane przyjmują zapis uproszczony. Jeśli tylko jedna grubość jest podana to dotyczy on wszystkich czterech krawędzi. Jeśli dwie grubości są podane, to pierwsza dotyczy górnej i dolnej krawędzi, a druga prawej i lewej. Jeśli podane są trzy grubości to pierwsza dotyczy górnej krawędzi, druga prawej i lewej, a trzecia dolnej krawędzi

div { border-width:1px 3px 5px 2px; }

div { border-width:thin; }

div { border-width:2px 4px; }

div { border-width:2px 4px 5px; }

border Jeśli wszystkie cztery krawędzie mają ten sam wygląd można użyć jednej deklaracji. Wartości oddzielone spacją według kolejności (te, które nie są określone przyjmą wartość domyślną lub dziedziczoną): 

border-width
border-style
border-color

div { border:1px double green; }

div { border:thin solid #00FF00; }


Klasyfikowanie i pozycjonowanie


CSS Classification/Positioning Properties
Właściwość Opis możliwe wartości Przykłady
clear Deklaracja strony na którą zostanie przeniesiony element  wobec innego w, którym ustawiony jest właściwość przepływania. left
right
both
none
div { clear:right; }

div { clear:both; }

cursor Deklaracja typu kursora adres URL pliku z kursorem oraz inne predefiniowane włąsciwości:

auto
crosshair
default
pointer
move
e-resize
ne-resize
nw-resize
n-resize
se-resize
sw-resize
s-resize
w-resize
text
wait
help

div { cursor:crosshair; }

div { cusrsor:url(image.csr); }

div { cusrsor:url(image.csr), pointer; }

display Deklaracja sposobu wyświetlania elementu. none
inline
block
list-item
run-in
compact
marker
table
inline-table
table-row-group
table-header-group
table-footer-group
table-row
table-column-group
table-column
table-cell
table-caption
div { display:none; }

div { display:inline; }

div { display:marker; }

float Deklaracja strony po której element będzie opływany innym. left
right
none
div { float:left; }

div { float:right; }

visibility Deklaracja widzialności lub ukrycia elementów. visible
hidden
collapse
div { visibility:visible; }

div { visibility:hidden; }

top Deklaracja odległości górnego  brzegu elementu od górnego brzegu pojemnika lub strony. długość

procent 

i inne wartości predefiniowane.

div { top:15px; }

div { top:2%; }

right Deklaracja odległości prawego brzegu elementu od prawego brzegu pojemnika lub strony. długość

procent 

i inne wartości predefiniowane.

 
div { right:15px; }

div { right:2%; }

bottom Deklaracja odległości dolnego  brzegu elementu od dolnego brzegu pojemnika lub strony. długość

procent 

i inne wartości predefiniowane.

div { bottom:15px; }

div { bottom:2%; }

left Deklaracja odległości lewego brzegu elementu od lewego brzegu pojemnika lub strony. długość

procent 

i inne wartości predefiniowane.

div { left:15px; }

div { left:2%; }

position Deklaracja typu pozycjonowania elementu. static
relative
absolute
fixed
div { position:absolute; }

div { position:relative; }

clip Deklaracja kształtu i wymiarów obszaru kadrowania. Kształty i predefiniowane wartości.

W CSS 2, jedyny dopuszczalny kształt to prostokąt. Odległość od każdego brzegu do obszaru kadrowania określa się w kolejności:

rect(top, right, bottom, left)

div { clip:auto; }

div { clip:rect(2px, 4px, 7px, 5px); }

overflow Deklaracja sposobu pokazania zawartości która wypływa z pojemnika. visible
hidden
scroll
auto
div { overflow:hidden; }

div { overflow:scroll; }

vertical-align Deklaracja  pionowego wyrównanie elementów względem siebie. długość, procent oraz predefiniowane właściwości: 

baseline
sub
super
top
text-top
middle
bottom
text-bottom

span { vertical-align:middle; }

td { vertical-align:top; }

z-index Deklaracja porządku elementów w stosie. Liczba całkowita lub wartości predefiniowane. div { z-index:2; }

div { z-index:auto; }


Właciwości wymiarowania


CSS Dimension Properties
Właściwość Opis możliwe wartości Przykłady
height Deklaracja wysokości elementu długość, procent oraz predefiniowane właściwości:  div { height:200px; }

div { height:50%; }

max-height Deklaracja maksymalnej wysokości elementu długość, procent oraz predefiniowane właściwości:  div { max-height:200px; }

div { max-height:50%; }

min-height Deklaracja minimalnej wysokości elementu długość, procent oraz predefiniowane właściwości:  div { min-height:200px; }

div { min-height:50%; }

width Deklaracja szerokości elementu długość, procent oraz predefiniowane właściwości:  div { width:500px; }

div { width:75%; }

max-width Deklaracja

maksymalnej szerokości elementu

długość, procent oraz predefiniowane właściwości:  div { max-width:500px; }

div { max-width:75%; }

min-width Deklaracja

minimalnej szerokości elementu

 
długość, procent oraz predefiniowane właściwości:  div { min-width:500px; }

div { min-width:75%; }


Właściwości czcionek


CSS Font Properties
Właściwość Opis możliwe wartości Przykłady
font-family Deklaracja nazwy czcionki. Główne typy czcionek i rodziny czcionek. Arial, Verdana, sans-serif, "Times New Roman", Times, serif, etc.

Rodziny czcionek oddzielane przecinkami.  Użycie czcionki następuje w kolejności w jakiej są dostępne.

div { font-family:Arial; }

div { font-family:Arial, Helvetica, sans-serif; }

font-size Deklaracja rozmiaru czcionki. Wysokość (numer i typ jednostki: 1em, 12pt, 10px, 80%) lub jedna z predefiniowanych wartości:

xx-small
x-small
small
medium
large
x-large
xx-large
smaller
larger

div { font-size:70%; }

div { font-size:0.85em; }

div { font-size:medium; }

font-size-adjust Właściwość obsługiwana przez niektóre przeglądarki: Częściowo w CSS 2, nieobsługiwana w CSS 2.1. ponownie dostepna w  CSS 3.

Deklaracja pionowych proporcji czcionek.

wartości numeryczne div { font-size-adjust:0.54; }

div { font-size-adjust:0.46; }

font-stretch Właściwość obsługiwana przez niektóre przeglądarki: Częściowo w CSS 2, nieobsługiwana w CSS 2.1. ponownie dostepna w  CSS 3.

Deklaracja rozciągnięcia czcionki

normal
wider
narrower
ultra-condensed
extra-condensed
condensed
semi-condensed
semi-expanded
expanded
extra-expanded
ultra-expanded
div { font-stretch:narrower; }

div { font-stretch:ultra-expanded; }

font-style Deklaracja stylu czcionki normal
italic
oblique
div { font-style:italic; }

div { font-style:oblique; }

font-variant Deklaracja typu czcionki normal
small-caps
div { font-variant:normal; }

div { font-variant:small-caps; }

font-weight Deklaracja typu czcionki i jej grubości. normal
bold
bolder
lighter
100
200
300
400
500
600
700
800
900
div { font-weight:bolder; }

div { font-weight:200; }

font Skrócona forma deklarowania wszystkich właściwości czcionki w jednym miejscu. (nie dotyczy: font-size-adjust i font-stretch). Oddzielone spacja wartości w następującej kolejności:  (wartości niezdefiniowane będą zastąpione domyślnymi lub dziedziczonymi):

font-style
font-variant
font-weight
font-size
line-height
font-family

div { font:italic small-caps bold 1em 1.2em Arial }

div { font:bold 0.8em Verdana }


Właściwości generowanej zawartości


CSS Generated Content Properties
Właściwość Opis możliwe wartości Przykłady
content
Deklaracja dodaje niewielką ilości tekstu i obrazki do dokumentu. Każdy element dokumentu może mieć dodany na początku i na końcu swojej zawartości po jednym pseudo-elemencie.
łańcuch tekstu, adres URL i wartości predefiniowane w formacie:

counter(name)
counter(name, list-style-type)
counters(name, string)
counters(name, string, list-style-type)
attr(X)
open-quote
close-quote
no-open-quote
no-close-quote

div:before { content:"some text"; }

div:after { content:url(page2.html); }

counter-increment Deklaracja generowania licznika elementów.  Może współpracować z content. liczby całkowite i predefinioane wartosci. 
counter-reset Deklaracja zerowania licznika elementów. liczby całkowite i predefinioane wartosci. 
quotes Deklaracja znaków cudzysłowów. liczby całkowite i predefinioane wartosci. 

Właściwości list


CSS List Properties
Właściwość Opis możliwe wartości Przykłady
list-style-type Deklaracja rodzaju markera w listach wyliczeniowych disc
circle
square
decimal
decimal-leading-zero
lower-roman
upper-roman
lower-alpha
upper-alpha
lower-greek
lower-latin
upper-latin
hebrew
armenian
georgian
cjk-ideographic
hiragana
katakana
hiragana-iroha
katakana-iroha
ol { list-style-type:upper-roman; }

ul { list-style-type:square; }

list-style-position Deklaracja pozycji znacznika wypunktowania listy. inside
outside
ol { list-style-position:inside; }

ul { list-style-position:outside; }

list-style-image Deklaracja obrazka użytego jako marker w listach wyliczeniowych. adres URL. ul { list-style-image:url(image.jpg); }
list-style Skrócona forma deklaracji wszystkich trzech stylów listy. Wartości oddzielone spacją w kolejności: (te które są niezdefiniowane przyjmą wartości domyślne lub dziedziczone):

list-style-type
list-style-position
list-style-image

ul { list-style:disc inside url(image.gif); }

ol { list-style:upper-roman outside; }

marker-offset Deklaracja odstępu wyróżnika wykazu. Długość i predefiniowane właściwości. li:before { display:marker; marker-offset:5px; }

Właściwości marginesów


CSS Margin Properties
Właściwość Opis możliwe wartości Przykłady
margin-top Deklaracja górnego marginesu elementu. Długość, procent i predefiniowane wartości. div { margin-top:5px; }

div { margin-top:15%; }

margin-right Deklaracja prawego marginesu elementu. Długość, procent i predefiniowane wartości. div { margin-right:5px; }

div { margin-right:15%; }

margin-bottom Deklaracja dolnego marginesu elementu. Długość, procent i predefiniowane wartości. div { margin-bottom:5px; }

div { margin-bottom:15%; }

margin-left Deklaracja lewego marginesu elementu. Długość, procent i predefiniowane wartości. div { margin-left:5px; }

div { margin-left:15%; }

margin Skrócona forma deklaracji wszystkich właściwości marginesów elementu. Wartości oddzielone spacją w kolejności: (te które są niezdefiniowane przyjmą wartości domyślne lub dziedziczone):

margin-top
margin-right
margin-bottom
margin-left
Wartości niezdefiniowane przyjmują zapis uproszczony.  Jeśli podana jest tylko długość jednego marginesu to będzie zastosowana do wszystkich czterech. Jeśli podane są dwie wartości, to pierwsza jest dla dolnego i górnego marginesu, a drugi dla lewego i prawego.  Jeśli podane są tylko trzy wartości to pierwsza dotyczy górnego marginesu, druga prawego i lewego, a trzecia dolnego marginesu.

div { margin:5px 12px 4px 7px; }

div { margin:5px; }

div { margin:5px 10px; }

div { margin:5px 7px 4px; }


Właściwości obrysu


CSS Outline Properties
Właściwość Opis możliwe wartości Przykłady
outline-color Deklaracja koloru obrysu Nazwy kolorów, wartości RGB w zapisie szesnastkowym. div { outline-color:green; }

div { outline-color:#00FF00; }

outline-style Deklaracja stylu obrysu none
dotted
dashed
solid
double
groove
ridge
inset
outset
div { outline-style:solid; }

div { outline-style:inset; }

outline-width Deklaracja grubości obrysu Grubość lub predefiniowane nazwy właściwości: 

thin
medium
thick

div { outline-width:2px; }

div { outline-width:thin; }

outline Skrócona forma deklaracji wszystkich właściwości obrysu elementu. Wartości oddzielone spacją w kolejności: (te które są niezdefiniowane przyjmą wartości domyślne lub dziedziczone):

outline-color
outline-style
outline-width

div { outline:green solid 2px; }

div { outline:#00FF00 double thick; }


Właściwości bloków


CSS Padding Properties
Właściwość Opis możliwe wartości Przykłady
padding-top Deklaracja szerokości górnego odstępu miedzy obramowaniem a elementem. Długość, procent i predefiniowane wartości. div { padding-top:5px; }

div { padding-top:15%; }

padding-right Deklaracja szerokości prawego odstępu miedzy obramowaniem a elementem. Długość, procent i predefiniowane wartości. div { padding-right:5px; }

div { padding-right:15%; }

padding-bottom Deklaracja szerokości dolnego odstępu miedzy obramowaniem a elementem. Długość, procent i predefiniowane wartości. div { padding-bottom:5px; }

div { padding-bottom:15%; }

padding-left Deklaracja szerokości lewego odstępu miedzy obramowaniem a elementem. Długość, procent i predefiniowane wartości. div { padding-left:5px; }

div { padding-left:15%; }

padding Skrócona forma deklaracji odstępu elementu od wszystkich stron obrysu. Wartości oddzielone spacją w kolejności: (te które są niezdefiniowane przyjmą wartości domyślne lub dziedziczone):

padding-top
padding-right
padding-bottom
padding-left
Wartości niezdefiniowane przyjmują zapis uproszczony.  Jeśli podana jest tylko wartość jednego odstępu to będzie zastosowana do wszystkich czterech. Jeśli podane są dwie wartości, to pierwsza jest dla dolnego i górnego odstępu, a druga dla lewego i prawego.  Jeśli podane są tylko trzy wartości to pierwsza dotyczy górnego odstępu, druga prawego i lewego, a trzecia dolnego odstępu.

div { padding:5px 12px 4px 7px; }

div { padding:5px; }

div { padding:5px 10px; }

div { padding:5px 7px 4px; }


Właściwości strony


CSS Page Properties
Właściwość Opis możliwe wartości Przykłady
marks Deklaracja typu znacznika strony, np. do wydrukowania. crop
cross
@page { marks:crop; }
orphans Deklaracja minimalna liczby wierszy, które muszą być na na dole wydrukowanej strony liczba całkowita @page { orphans:2; }
page Deklaracja nazwy strony. Identyfikator
page-break-after Przełamanie strony po elemencie. auto
always
avoid
left
right
page-break-before Przełamanie strony przed elementem. auto
always
avoid
left
right
page-break-inside Przełamanie strony wewnątrz elementu. auto
avoid
size Deklaracja rozmiaru i orientacji strony. Długość i predefiniowane nazwy właściwości: 

auto
landscape
potrait

widows Deklaracja minimalnej liczba wierszy, które muszą być na górze wydrukowanej strony. liczba całkowita @page { widows:2; }

Właściwości tabeli


CSS Table Properties
Właściwość Opis możliwe wartości Przykłady
border-collapse Deklaracja sposobu wyświetlania komórek tabeli: scalone lub oddzielone. collapse
separate
table { border-collapse:collapse; }

table { border-collapse:separate; }

border-spacing Deklaracja odległości między komórkami tabeli. Oddzielone spacją wartości odległości poziomych i pionowych.

Jeśli podana jest tylko jedna wartość to dotyczy odległości poziomej i pionowej.  jeśli podane są dwie wartości to pierwsza dotyczy poziomej, a druga pionowej.

table { border-spacing:5px; }

table { border-spacing:5px 10px; }

caption-side Deklaracja miejsca wyświetlania tytułu tabeli. top
bottom
left
right
caption { caption-side:top; }

caption { caption-side:right; }

empty-cells Deklaracja sposobu pokazywania pustych komórek tabeli.  show
hide
table { empty-cells:show; }

table { empty-cells:hide; }

table-layout Deklaracja układu tabeli auto
fixed
table { table-layout:auto; }

table { table-layout:fixed; }


Właściwości tekstu


CSS Text Properties
Właściwość Opis możliwe wartości Przykłady
color Deklaracja koloru tekstu Nazwy kolorów RGB lub ich oznaczenia szesnastkowe:

aqua
black
blue
fuchsia
gray
green
lime
maroon
navy
olive
purple
red
silver
teal
white
yellow

div { color:green; }

div { color:rgb(0,255,0);}

div { color:#00FF00; }

direction Deklaracja kierunku czytania tekstu ltr
rtl

ltr = left-to-right
rtl = right-to-left

div { direction:ltr; }

div { direction:rtl; }

line-height Deklaracja odstępu miedzy liniami. Liczby, procent, długość i predefiniowane wartości. div { line-height:normal; }

div { line-height:2em; }

div { line-height:125%; }

letter-spacing Deklaracja odległości między znakami tekstu. Długość lub predefiniowane wartości. div { letter-spacing:normal; }

div { letter-spacing:5px; }

div { letter-spacing:-1px; }

text-align Deklaracja poziomego wyrównabia tekstu. left
right
center
justify
div { text-align:center; }

div { text-align:right; }

td { text-align:"."; }

text-decoration Deklaracja wyróżnienia lub dekoracji czcionki. none
underline
overline
line-through
blink
div { text-decoration:none; }

div { text-decoration:underline; }

text-indent Deklaracja wielkości wcięcia pierwszego wiersza tekstu. długość lub procent div { text-indent:12px; }

div { text-indent:2%; }

text-shadow Deklaracja efektu cienia tekstu. Oddzielone spacjami wartości:
  • kolor cienia
  • pozioma odległość od prawej strony tekstu
  • pionowa odległość poniżej tekstu
  • kąt cienia
div { text-shadow:green 2px 2px 7px; }

div { text-shadow:olive -3px -4px 5px; }

text-transform Deklaracja zmiany wielkości liter w tekście. none
capitalize
uppercase
lowercase
div { text-transform:uppercase; }

div { text-transform:lowercase; }

unicode-bidi Deklaracja tekstu dwukierunkowego. normal
embed
bidi-override
div { unicode-bidi:embed; }

div { unicode-bidi:bidi-override; }

white-space Declaracja sposoby wyświetlania białych znaków. normal
pre
nowrap
div { white-space:pre; }

div { white-space:nowrap; }

word-spacing Deklaracja odległości między wyrazami tekstu. długość lub predefiniowane wartości. div { word-spacing:normal; }

div { word-spacing:1.5em; }


Właściwości dźwięku


Other CSS Properties
Właściwość Opis możliwe wartości Przykłady
azimuth Deklaracja azymutu dźwięku przestrzennego. wartości kąta w stopniach lub jedna z predefiniowanych wartości:

left-side
far-left
left
center-left
center
center-right
right
far-right
right-side
behind
leftwards
rightwards

div { azimuth:90deg; }

div { azimuth:behind; }

cue-after Deklaracja sygnału wywoławczego audio po elemencie. adres URL i predefiniowane wartości. div { cue-after:url(sound.wav); }

div { cue-after:none; }

cue-before Deklaracja sygnału wywoławczego audio przed elementem adres URL i predefiniowane wartości. div { cue-before:url(sound.wav); }

div { cue-before:none; }

cue Deklaracja sygnału wywoławczego audio przed i po elementencie. adres URL i predefiniowane wartości. Wartości oddzielone spacją w kolejności:

cue-before
cue-after

Jeśli tylko jedna wartość jest podana to dotyczy ona przed i po elemencie.

div { cue:url(sound.wav) url(sound2.wav); }

div { cue:url(sound.wav); }

elevation Deklaracja podniesienia dźwięku przestrzennego. wartości kąta w stopniach lub jedna z predefiniowanych wartości:

below
level
above
higher
lower

div { elevation:30deg; }

div { elevation:higher; }

pause-after Deklaracja przerwy po elemencie. czas w milisekundach (ms) lub procent. div { pause-after:100ms; }

div { pause-after:20%; }

pause-before Deklaracja przerwy przed elementem. czas w milisekundach (ms) lub procent. div { pause-before:100ms; }

div { pause-before:20%; }

pause Deklaracja przerwy przed i po elemencie. Wartości oddzielone spacją w kolejności:

pause-before
pause-after

Jeśli tylko jedna wartość jest podana to dotyczy przerwy przed i po elemencie

div { pause:200ms 100ms; }

div { pause:100ms; }

pitch Deklaracja średniej wysokości tonu. Częstotliwość w Hertzach (Hz) lub predefiniowane wartości:

x-low
low
medium
high
x-high

div { pitch:120Hz; }

div { pitch:high; }

pitch-range Deklaracja odchylenia częstotliwości od średniej. Wartości numeryczne od 0 do 100  div { pitch-range:50; }

div { pitch-range:99; }

play-during Deklaracja tła dźwiękowego podczas wymowy adres URL,  oddzielone spacją:

mix
repeat

auto
none

div { play-during:url(music.wav); }

div { play-during:url(music.wav) repeat; }

div { play-during:none; }

richness Deklaracja bogactwa dźwięku w wymowie. Wartości numeryczne od 0 do 100  div { richness:50; }

div { richness:0; }

speak Deklaracja sposobu wymawiania. normal
none
spell-out
div { speak:none; }

div { speak:spell-out; }

speak-header Deklaracja częstotliwości czytania nagłówków tabel. once
always
th { speak-header:once; }

th { speak-header:always; }

speak-numeral Deklaracja wymowy liczebników. digits
continuous
div { speak-numeral:digits; }

div { speak-numeral:continuous; }

speak-punctuation Deklaracja sposobu wymowy interpunkcji. code
none
div { speak-punctuation:code; }

div { speak-punctuation:none; }

speech-rate Deklaracja prędkości wymowy tekstu. Ilość słów na minutę lub jedna z predefiniowanych wartości:

x-slow
slow
medium
fast
x-fast
faster
slower

div { speech-rate:50; }

div { speech-rate:medium; }

stress Deklaracja akcentu wymawianego tekstu. Wartości numeryczne od 0 do 100  div { stress:50; }

div { stress:0; }

voice-family Deklaracja rodziny głosów wymawianego tekstu. Generic lub predefiniowane wartości.
volume Deklaracja głośności. Wartości numeryczne od 0 do 100 , procenty, jedna lub więcej predefiniowanych wartości. values:

silent
x-soft
soft
medium
loud
x-loud

div { volume:50; }

div { volume:silent; }