DHTML0074

Rozdział 4.

Tworzenie w5szq<y<h wcięć

Tworzenie wiszących wcięc

Często się zdarza, że tekst w elemencie listy wypunktowanej jest za duży, aby zmieścić

śl£ WJććłrtćJ linii. Używając właściwości line-style-position możesz określić pozycję tekstu przeniesionego do następnej linii w stosunku do symbolu listy. Tekst przeniesiony do następnej linii i wcięty tak, że zaczyna się poniżej pierwszej litery poprzedniej linii tekstu, nazywany jest wiszącym wcięciem.

Aby zdefiniować pozycję linii przeniesionego tekstu elementu listy

1. ,bezwciecia{

Stwórz selektor. W tym przykładzie stworzymy niezależną klasę o nazwie bezwciecia, która w przypadku użycia w znaczniku listy spowoduje zrównanie tekstu z symbolem elementu listy.

2. line-style-position:

Podaj nazwę właściwości i dwukropek.

3. inside

Podaj jedną z dwóch podanych poniżej wartości określających sposób wcięcia tekstu:

• inside, powoduje, że tekst przeniesiony do następnych linii będzie umieszczony pod znacznikiem listy;

• outside, powoduje, że tekst przeniesiony do następnych linii zostanie wyrównany do pierwszej litery pierwszej linii tekstu.

4. ;}

Zamknij definicję zapisując średnik i zamykający nawias klamrowy'}.

S Rady

■ Właściwość list-style-position można stosować w Netscape Navigatorze.

■ Ogólnie rzecz biorąc, listy wypunktowane, w których stosowane są wiszące wcięcia (wartość outside właściwości list-style-position), wyróżniają się znacznie lepiej od list,

w których wiszące wcięcia nie są stosowane (wartość inside właściwości list-style-position).

Listing 4.2. W tym przykładzie w listach będą stosowane wiszące wcięcia, chyba że wykorzystana zostanie klasa bezwciecia, która spowoduje, że tekst punktu przeniesiony do

rifliKpej linii Manie mimmy na mni

ze znacznikiem punktów listy

<ht.ml>

<head>

LI { list-style-position: outside; width--»200px; }

.bezwciecia {list-style-position: inside;}

</style>

</head>

cbody bgcolor=^,,#FFFFFF^,ł>

<ul>

<li>W języku HTML definiuje się po kolei wszystkie ...

<li class="bezwciecia">Para znaczników TR i /TR ...

<li>Podpisy tabel informują o tym, czego dotyczy ...

</ul>

</body>

</html>

Rysunek 4.2. Kod z listingu 4.2 wyświetlony w przeglądarce

Wyszukiwarka

Podobne podstrony:
DHTML0134 Rozdział 8. Tworzenie pasków tytułowychTworzenie pasków tytułowych Wyświetlenie zawartości
DHTML0136 Rozdział 8. Tworzenie wyróżniających się tytułówTworzeniewyróżniających się tytułów Tytuły
DHTML0130 Rozdział 8. Rozdział 8. Tworzenie nagłówkówTworzenie nagłówków z graficznym tłem Jednym z
Rozdział Udział pielęgniarki w tworzeniu warunków do utrzyma0 • racjonalne odżyw
DHTML0022 Rozdział 1. Rozdział 1. Czym jest styl?Czym jest styl? Większość dostępnych procesorów tek
DHTML0024 Rozdział 1. Rozumienie reguł CSS Gdzie umieszczać reguły CSS? Reguły mogą być umieszczane
DHTML0028 Rozdział 1. Definicje: właściwości i wartościDefinicje:właściwości i wartości /a selektore
DHTML0030 Rozdział 1. Definiowanie selektorów klasDefiniowanie selektorów klas Użycie selektorów kla
DHTML0032 Rozdział 1. Rozdział 1. Definiowanie saelektora identyfikatora i i j i jneużt!.
DHTML0034 Rozdział 1. Umieszczanie selektorów w kontekście ROZDZIAŁ 7. O problemach nmlaj-skicli Pro
DHTML0036 Rozdział 1. Dodawanie CSS do dokumentu HTML-owego Głównym zastosowaniem CSS jest definiowa
DHTML0040 Rozdział 1. Rozdział 1. Dodawanie komentarzy do CSSDodawanie komentarzy do CSS Arkusze sty
DHTML0042 Rozdział 1. Dziedziczenie właściwościDziedziczenie właściwości od znaczników rodzicielskic
DHTML0044 Rozdział 1.Określanie porządku kaskady Na jednej stronie WWW możesz dysponować dołączonymi
DHTML0046 Rozdział 1. Rozdział 1. Rozwiązywanie problemów z CSSRozwiązywanie problemów z CSS Bardzo
DHTML0049 Rozdział 2. Określanie czcionkiOkreślanie czcionki Czcionka użyta do wyświetlenia tekstu m
DHTML0051 Rozdział 2. Ustawianie wielkośu czcionki 6pl 12ptUstawianie wielkości czcionki HTML udostę
DHTML0053 Rozdział 2. Wyświetlanie tekstu kursywąWyświetlanie tekstu kursywę Bardzo często mylone są
DHTML0055 Rozdział 2. Rozdział 2. Gruby, grubszy, najgrubszyGruby, grubszy, najgrubszy W prostym HTM

więcej podobnych podstron