Tematy: Czcionka pogrubiona | Czcionka pochylona | Czcionka o stałej szerokości | Superskrypt | Subskrypt | Duża czcionka | Mała czcionka | Odwołanie do źródła | Definicja | Element usunięty | Element wstawiony | Skrót i akronim | Czcionka mocno wyróżniona | Czcionka wyróżniona | Kod | Czcionka z klawiatury | Przykład | Zmienna | Kolor czcionki | Wielkość czcionki | Krój czcionki

Znaczniki czcionki

O rozdziale:

Znaczniki opisujące czcionki znajdują ciągle zastosowanie na stronach WWW. Pamiętaj jednak, że kilka z nich uznano za przestarzałe, wielu z nich praktycznie się już nie używa, zaś World Wide Web Consortium zaleca generalnie wykorzystywanie do opisu czcionek stylów. Obok klasycznych poleceń HTML podajemy zatem także ich odpowiedniki w stylach CSS.

Znaczniki fizyczne

Znaczniki fizyczne działają w podobny sposób jak atrybuty czcionek w edytorze tekstów, tworząc warstwę prezentacyjną redagowanego tekstu - wyróżniają one pewne fragmenty z całego przekazu.

Czcionka pogrubiona

Kod:

<b> </b>

Przykład:

To jest czcionka pogrubiona (bold)

Polecenie pogrubienia istnieje jeszcze w specyfikacji XHTML 1.1, natomiast prawdopodobnie zostanie wycofane w XHTML 2.0. Już teraz w miejsce pogrubienia zaleca się stosowanie polecenia strong, które ma charakter logiczny, a nie fizyczny.

Odpowiednik w stylach CSS: font-weight: bold - więcej...

Informacje o B

Czcionka pochylona

Kod:

<i> </i>

Przykład:

To jest czcionka pochylona (italic)

Polecenie pochylenia istnieje jeszcze w specyfikacji XHTML 1.1, natomiast prawdopodobnie zostanie wycofane w XHTML 2.0. Już teraz w miejsce pochylenia zaleca się stosowanie polecenia em, które ma charakter logiczny, a nie fizyczny.

Odpowiednik w stylach CSS: font-style: italic - więcej...

Informacje o I

Czcionka o stałej szerokości znaku

Kod:

<tt> </tt>

Przykład:

To jest czcionka monotypiczna, o stałej szerokości znaku (fixed width = teletype)

Polecenie zostało zachowane jeszcze w specyfikacji XHTML 1.1, ale prawdopodobnie zostanie wycofane z wersji XHTML 2.0

Odpowiednik w stylach CSS: font-family: monospace - więcej...

Informacje o TT

Superskrypt (indeks górny)

Kod:

<sup> </sup>

Przykład:

Czcionka z superskryptem

Odpowiednik w stylach CSS: vertical-align: super - więcej...

Informacje o SUP

Subskrypt (indeks dolny)

Kod:

<sub> </sub>

Przykład:

Czcionka z subskryptem

Odpowiednik w stylach CSS: vertical-align: sub - więcej...

Informacje o SUB

Duża czcionka (+1 punkt)

Kod:

<big> </big>

Przykład:

Duża czcionka

Polecenie zostało jeszcze zachowane w XHTML 1.1, ale prawdopodobnie zostanie wycofane z XHTML 2.0.

Odpowiednik w stylach CSS: font-size: larger - więcej...

Informacje o BIG

Mała czcionka (-1 punkt)

Kod:

<small> </small>

Przykład:

Mała czcionka

Polecenie zostało jeszcze zachowane w XHTML 1.1, ale prawdopodobnie zostanie wycofane z XHTML 2.0.

Odpowiednik w stylach CSS: font-size:smaller - więcej...

Informacje o SMALL

Znaczniki logiczne

Znaczniki logiczne odnoszą się do konkretnych zastosowań, ale wizualny efekt ich działania jest analogiczny jak w przypadku znaczników fizycznych. Czcionka pogrubiona, pochylona lub monotypiczna są domyślnie przypisane do wybranego znacznika logicznego.

Odwołanie do źródła

Kod:

<cite> </cite>

Przykład:

To jest odwołanie do źródła

Informacje o CITE

Definicja

Kod:

<dfn> </dfn>

Znacznik <dfn>, czyli Defining Instance, jest poleceniem stosowanym do wyróżniania jakiegoś fragmentu tekstu, np. pojawiającego się po raz pierwszy w danym tekście terminu. Przeglądarki interpretują <dfn> jako kursywę. Na przykład:

Firefox to przeglądarka Mozilli.

Informacje o DFN

Element usunięty

Przy najrozmaitszych rewizjach tekstów możemy się posłużyć poleceniem <del>, które sygnalizuje zmiany. Pokazuje ono przekreślony fragment tekstu, np.:

Kod:

<del> </del>

Przykład:

Dokument dotyczący naszej polityki sprzedaży nie jest już dostępny.

Informacje o DEL

Element wstawiony

Gdy chcemy wyraźnie podkreślić jakąś nowość, możemy się posłużyć poleceniem <ins>.

Kod:

<ins> </ins>

Przykład:

To jest nowe opracowanie tematu

Informacje o INS

Skrót i akronim

Nowymi poleceniami HTML 4 są skrót i akronim. Oba polecenia sygnalizują obecność skrótów (np. dyr., prof.) i akronimów (np. WWW, AWS) i będą mogły być wykorzystywane w trakcie syntezy dźwięku przez odpowiednie oprogramowanie, systemy wyszukiwawcze, korektory poprawności ortograficznej czy systemy automatycznego tłumaczenia. Atrybut języka precyzuje język dla poprawnego działania tych systemów.

Kod:

<abbr lang="pl" title="Profesor">Prof.</abbr>
<acronym lang="en" title="World Wide Web">WWW</acronym>

Przykład:

Prof.

WWW

Informacje o ABBR

Informacje o ACRONYM

Czcionka mocno wyróżniona (strong)

Polecenie <strong> jest zalecane w miejsce stosowanego do tej pory powszechnie polecenia <b>, które prawdopodobnie zostanie wycofane ze specyfikacji w XHTML 2.0

Kod:

<strong> </strong>

Przykład:

To jest czcionka mocno wyróżniona (strong)

Informacje o STRONG

Czcionka wyróżniona (emfaza)

Polecenie <em> jest zalecane w miejsce stosowanego do tej pory powszechnie polecenia <i>, które prawdopodobnie zostanie wycofane ze specyfikacji w XHTML 2.0

Kod:

<em> </em>

Przykład:

To jest czcionka wyróżniona (emphasis)

Informacje o EM

Kod (tekst programu)

Kod:

<code> </code>

Przykład:

To jest kod (code)

Informacje o CODE

Czcionka wprowadzana z klawiatury

Kod:

<kbd> </kbd>

Przykład:

Czcionka z klawiatury

Informacje o KBD

Przykład

Kod:

<samp> </samp>

Przykład:

Przykład (sample)

Informacje o SAMP

Zmienna (słowo kluczowe języka)

Kod:

<var> </var>

Przykład:

Zmienna (variable)

Informacje o VAR

Kolory czcionki

Dowolnemu fragmentowi tekstu można nadać kolor. W starszych wersjach HTML stosowano polecenie font color="nazwa_koloru", jednak w HTML 4 zostało ono uznane za przestarzałe i do określania koloru stosuje się obecnie style.

<p style="color: blue; ">Tekst w kolorze niebieskim.</p>

Tekst w kolorze niebieskim.

Poniżej przedstawiamy listę 16 podstawowych barw (nazwy imienne) stosowanych w dokumentach internetowych.

Przykład:

tekst próbny - black

tekst próbny - olive

tekst próbny - teal

tekst próbny - red

tekst próbny - blue

tekst próbny - maroon

tekst próbny - navy

tekst próbny - gray

tekst próbny - lime

tekst próbny - fuchsia

tekst próbny - white

tekst próbny - green

tekst próbny - purple

tekst próbny - silver

tekst próbny - yellow

tekst próbny - aqua

Więcej informacji - rozdział Kolor w stylach...

Wielkość czcionki

Dowolnemu fragmentowi tekstu można nadać wielkość czcionki. W starszych wersjach HTML stosowano polecenie font size="wielkość", jednak w HTML 4 zostało ono uznane za przestarzałe i do określania wielkości stosuje się obecnie style.

<p style="font-size: large; ">Tekst o wielkości large</p>

Tekst o wielkości large

Przykład:

To jest tekst normalny

Tekst o wielkości xx-small

Tekst o wielkości x-small

Tekst o wielkości small

Tekst o wielkości medium

Tekst o wielkości large

Tekst o wielkości x-large

Tekst o wielkości xx-large

Więcej informacji - rozdział Wielkość czcionki o stylach

Krój czcionki

W starszych wersjach HTML stosowano polecenie font face="nazwa_kroju". W HTML 4.01 zrezygnowano z niego na rzecz stylów. Na przykład:

<p style="font-family: arial; ">Treść akapitu wyświetlona krojem Arial</p>

Treść akapitu wyświetlona krojem Arial

Treść akapitu wyświetlona krojem Courier

Treść akapitu wyświetlona krojem Verdana

Więcej informacji: - rozdział Rodzina czcionek w stylach