<!DOCTYPE html>
<html lang='pl-PL'>
<head>
<title>Styl CSS</title>
<meta charset='utf-8'>
</head>
<body>
<h1>Styl strony</h1>
<p>To jest skromna prezentacja możliwości kaskadowych
arkuszy stylów (CSS).</p>
<p>Kaskadowe arkusze stylów – język służący do opisu
formy prezentacji stron WWW. CSS został opracowany
przez organizację W3C w 1996 r. Pierwszy szkic CSS
zaproponował w 1994 r. Håkon Wium Lie
(<i>Wikipedia</i>).</p>
</body>
</html><!DOCTYPE html>
<html lang='pl-PL'>
<head>
<title>Inline CSS</title>
<meta charset='utf-8'>
</head>
<body style='margin: 20px 50px;'>
<h1 style='text-align: center; color: blue;'>
Inline CSS - globalny atrybut <em>style</em>
</h1>
<p style='text-align: justify;'>Globalny atrybut
<em>style</em> elementu (znacznika) HTML zawiera
deklaracje stylów CSS, które mają być zastosowane
do tego elementu.</p>
<p style='font-size: 150%; background-color: #d1d1d1;'>
<code><znacznik style='cecha: wartość; cecha: wartość; ...'></code>
</p>
<p style="color:red; padding: 5px; border: 1px solid red;">
Zaleca się, aby style były definiowane w osobnym pliku.
Ten atrybut ma głównie na celu umożliwienie szybkiego
stylizowania dokumentu, na przykład do celów testowych.</p>
</body>
</html><!DOCTYPE html>
<html lang='pl-PL'>
<head>
<title>Internal CSS</title>
<meta charset='utf-8'>
<style>
h1 { text-align: center; color: blue; }
p { text-align: justify; }
#kod { font-size: 150%; background-color: #d1d1d1; }
</style>
</head>
<body style='margin: 20px 50px;'>
<h1>Internal CSS - znacznik <em><style></em></h1>
<p>Znacznik <em><style></em> umieszczony w sekcji <head>
dokumentu HTML zawiera deklaracje stylów CSS, które mają być
zastosowane w tym dokumencie.</p>
<p id='kod'>
<code>selektor { cecha: wartość; cecha: wartość; ...}
</p>
<p style="color:red; padding: 5px; border: 1px solid red;">
Zaleca się, aby style były definiowane w osobnym pliku.
Ten znacznik ma głównie na celu umożliwienie szybkiego
stylizowania dokumentu, na przykład do celów testowych.</p>
</body>
</html><!DOCTYPE html>
<html lang='pl-PL'>
<head>
<title>Internal CSS</title>
<meta charset='utf-8'>
<style>
h1 { text-align: center; color: blue; }
p { text-align: justify; }
#kod { font-size: 150%; background-color: #d1d1d1; }
.ramka { color:red; padding: 5px; border: 1px solid red; }
</style>
</head>
<body style='margin: 20px 50px;'>
<h1>Internal CSS - znacznik <em><style></em></h1>
<p>Znacznik <em><style></em> umieszczony w sekcji <head>
dokumentu HTML zawiera deklaracje stylów CSS, które mają być
zastosowane w tym dokumencie.</p>
<p id='kod'>
<code>selektor { cecha: wartość; cecha: wartość; ...}</code>
</p>
<p class='ramka'>
Zaleca się, aby style były definiowane w osobnym pliku.
Ten znacznik ma głównie na celu umożliwienie szybkiego
stylizowania dokumentu, na przykład do celów testowych.</p>
</body>
</html><!DOCTYPE html>
<html lang='pl-PL'>
<head>
<title>Internal CSS</title>
<meta charset='utf-8'>
<style>
h1 { text-align: center; color: blue; }
p { text-align: justify; }
#kod { font-size: 150%; background-color: #d1d1d1; }
.ramka { color:red; padding: 5px; border: 1px solid red; }
</style>
</head>
<body style='margin: 20px 50px;'>
<h1>Internal CSS - znacznik <em><style></em></h1>
<p>Znacznik <em><style></em> umieszczony w sekcji
<head> dokumentu HTML zawiera deklaracje stylów CSS,
które mają być zastosowane w tym dokumencie.</p>
<p id='kod'>
<code>selektor { cecha: wartość; cecha: wartość; ...}</code>
</p>
<p class='ramka'>
Zaleca się, aby style były definiowane w osobnym pliku.
Ten znacznik ma głównie na celu umożliwienie szybkiego
stylizowania dokumentu, na przykład do celów testowych.</p>
<p class='ramka'>Identyfikator o ustalonej wartości
(np. <code>id='kod'</code>) może wystąpić tylko w jednym znaczniku
w dokumencie, natomiast styl zapisany w klasie (np.
<code>class='ramka'</code> może być użyty w wielu znacznikach.</p>
</body>
</html><!DOCTYPE html>
<html lang='pl-PL'>
<head>
<title>Internal CSS</title>
<meta charset='utf-8'>
<style>
h1 { text-align: center; color: blue; }
p { text-align: justify; }
#kod { font-size: 150%; background-color: #d1d1d1;
font-family: monospace;}
.ramka { color:red; padding: 5px; border: 1px solid red; }
</style>
</head>
<body style='margin: 20px 50px;'>
<h1>Internal CSS - znacznik <em><style></em></h1>
<p>Znacznik <em><style></em> umieszczony w sekcji <head>
dokumentu HTML zawiera deklaracje stylów CSS, które mają być
zastosowane w tym dokumencie.</p>
<p id='kod'>selektor { cecha: wartość; cecha: wartość; ...}</p>
<p class='ramka'>
Zaleca się, aby style były definiowane w osobnym pliku.
Ten znacznik ma głównie na celu umożliwienie szybkiego
stylizowania dokumentu, na przykład do celów testowych.</p>
<p class='ramka'>Identyfikator o ustalonej wartości
(np. <code>id='kod'</code>) może wystąpić tylko w jednym znaczniku
w dokumencie, natomiast styl zapisany w klasie (np.
<code>class='ramka'</code> może być użyty w wielu znacznikach.</p>
</body>
</html><!DOCTYPE html>
<html lang='pl-PL'>
<head>
<title>External CSS</title>
<meta charset='utf-8'>
<link rel='stylesheet' href='style.css'>
</head>
<body style=''>
<h1>External CSS - znacznik <em><link ... ></em></h1>
<p>Znacznik <em><style rel='stylesheet' href='...'></em>
umieszczony w sekcji <head> dokumentu HTML włącza do
dokumentu HTML z zewnętrznego pliku deklaracje stylów CSS, które mają być
zastosowane w tym dokumencie.</p>
<p id='kod'><link rel='stylesheet' href='style.css'></p>
</body>
</html><!DOCTYPE html>
<html lang='pl-PL'>
<head>
<title>External CSS</title>
<meta charset='utf-8'>
<style>@import 'style.css';</style>
</head>
<body style=''>
<h1>External CSS - importowanie stylu z pliku</h1>
<p>Znacznik <em><style></em> umieszczony w sekcji
<em><head></em> umożliwia importowanie stylu
z zewnętrznego pliku.</p>
<p id='kod'><style>@import 'style.css';</style></p>
</body>
</html><!DOCTYPE html>
<html lang='pl-PL'>
<head>
<title>External CSS</title>
<meta charset='utf-8'>
<style>@import url('style.css');</style>
</head>
<body style=''>
<h1>External CSS - importowanie stylu z pliku</h1>
<p>Znacznik <em><style></em> umieszczony w sekcji
<em><head></em> umożliwia importowanie stylu
z zewnętrznego pliku.</p>
<p id='kod'><style>@import url('style.css');</style></p>
</body>
</html>