DHTML0108

Marginesy i obramowania

Listing 6. /.?. Każdy akapit, w którym zostanie użyta klasa tnt, będzie przesuwany rta prawą stroną

htrnl>

head>

<me ta ht tip—    i v= " Cont enL-Type "

t«"te:-:t/htial; char.set- l$0-^859-2">

_ii.l.e>Listing 6.13</tir.le>

<51.yię ty pe = "te:-: 1/css">

P.tnt ( float: right; tcnt-weight: bold; width: 2?5py.j padding: 1 cm; \

</style>

</head>

•body bgcQlor=^M#FFFFFF">

<p class=^,łtnt">

CMG SRC=" . ,/images./rysl.gif" width«^M100" heichł: «"88^,ł align*"right ">

W jęiykj KTMIj definiuje się po kolei wszystkie wiersze tabeli, a każdy z wierszy zawiera definicję wszystkich zawartych w nim komórek. </p>

<p>Podpisy tabel inforrnnią o tym, czego ... </_P>

</body>

</htmi>

6.U -Netscape

ŁiaJS

ił    %

Oack i . j ftyoad

m

Home

¹ ^ $e*ch

£

Gu&

•Jv, iś .

Pim itKuty ■

Podpisy tabel informują o sym, czego dotyczy tabela Podpis definiowany jest przez paię znaczników CAPTTONi

(CAfnON.tórt

powinny znaleić się w obrębie znacznika TABLE przed

deSraowaniem wierszy Znacznik CAPTION posiada atrybuty, które określają położenie tekstu podpisu względem tabeli Atrybut ALTON przyjmuje -wartości LEFT, RIGHT i CENTER, a shiźy do wyrównywania podpisu w poziomie. Polecenie VALIGN unucsscza podpis nad tabela (wartość TOP) hib pod nią (wartość BOTTOM)

± ___"

Rysunek 6.14. Jeden element ..oblewa" inny

W języku HTML definiuje się po kolei wszystkie wiersze tabeli, a każdy z wierszy

zawiera definicję WSZys zawartych w nim kninorek.

Zawijanie tekstu wokół innego tekstu („opływanie")

We wczesnej fazie rozwoju HTML-a, kiedy dodana została możliwość opływania grafiki przez tekst, projektanci stron WWW na całym świecie byli zachwyceni. Kaskadowe arkusze stylów jeszcze bardziej usprawniają tę technikę poprzez udostępnienie możliwości pozwalających na tworzenie nie tylko tekstu opływającego grafikę, lecz także tekstu opływającego inny tekst lub tablice. Jest to możliwe dzięki zastosowaniu właściwości float. Rysunek 6.14 prezentuje przykład tekstu „pływającego” wewnątrz innego tekstu.

Aby zdefiniować ruchomą pozycję selektora

1.    P.tnt {

Podaj selektor. W przykładzie pokazanym na listingu 6.13 stworzyliśmy zależną klasę, która może być użyta ze znacznikiem akapitu.

2.    float:

Rozpocznij definicję od podania właściwości float i dwukropka.

3.    right

Następnie podaj słowo kluczowe określające stronę okna przeglądarki, ku której element powinien się przesuwać. Wybierz jedną z poniższych wartości:

•    right, aby wyrównać element do prawej, co spowoduje, żc pozostałe elementy będą zawijane z jego lewej strony;

•    left, aby wyrównać element do lewej, co spowoduje, że pozostałe elementy będą zawijane z jego prawej strony;

•    nonę, aby użyte zostało wyrównanie elementu rodzicielskiego.

Zawijanie tekstu

4. ; font-weight: bold; width: 275px; padding: 1em;) Zakończ definicję średnikiem i podaj inne definicje tej reguły. W naszym przypadku pływający tekst będzie grubszy. W końcu zamknij regułę za pomocą zamykającego nawiasu klamrowego.

111