Forum hosting 4un.eu

Pełna wersja: Odpowiedni styl zamiast znaczników <i>,<u>,<b>
Aktualnie przeglądasz uproszczoną wersję forum. Kliknij tutaj, by zobaczyć wersję z pełnym formatowaniem.
W dawnych czasach, wygląd strony oraz zawartość, była wstawiana tylko przez podanie określonych znaczników html, style jeszcze nie istniały, do wyróżniania różnych części służyły poszczególne znaczniki.
Po rozpoczęciu paragrafu, gdy chciało się wyróżnić tekst np. przez podkreślenie trzeba było posłużyć się znacznikiem <u> skrótem od underline można było tekst pogrubić <b> znacznikiem, który po angielsku znaczy bold, oraz pisać kursywą używając znacznika <i>.
Obecnie do opisywania wyglądu służą style.
Każdy paragraf - akapit można opisać w ten sposób wystarczy wpisywać już tylko sam znacznik <p> resztę wyglądu opisuje właśnie styl.
np.
font-weight: bold; spowoduje to samo co wpisanie znacznika <b>.
font-style: italic; spowoduje to samo co wpisanie znacznika <i>.
text-decoration: underline; spowoduje to samo co wpisanie <u>.

font-weight: bold; zamiast wartości bold można też wstawić jedną z wartości: normal, bold, bolder, lighter, 100, 200, 300, 400, 500, 600, 700, 800, 900

font-style: italic; zamiast wartości italic można też wstawić:
normal, italic, oblique[i/]

text-decoration: underline; zamiast podkreślenia można wstawić:
[i]none
, underline, overline, line-through, blink

domyślnie dla znacznika <p> wartość font-weight oraz font-style jest normal, a text-decoration: none;
definiowanie podkreślenia pogrubienia i kursywy, dla wszystkich akapitów w zewnętrznym arkuszu stylów (plik .css) można dokonać wpisując do pliku arkusza:
Cytat:P {
font-weight: bold;
font-style: italic;
text-decoration: underline;
}
odtąd wszystkie akapity będą pisane grubą czcionką kursywą i będą podkreślone.
jeżeli chcemy, aby tylko jeden akapit był podkreślony powinniśmy posłużyć się klasą. Przykładowa klasa będzie wyglądała tak:
Cytat:.akapit {
font-weight: normal;
font-style: normal;
text-decoration: underline;
}
odtąd możemy posługiwać się klasą
kiedy będziemy potrzebowali tylko podkreślenia wystarczy wpisać w pliku .html:
Cytat:<p class="akapit">tekst podkreślony</p>
analogicznie możemy zdefiniować tylko pogrubienie:
Cytat:.drugi {
font-weight: bold;
font-style: normal;
text-decoration: none;
}
Cytat:<p class="drugi">tekst tylko pogrubiony</p>
Cytat:.trzeci{
font-weight: normal;
font-style: italic;
text-decoration: none;
}
Cytat:<p class="trzeci">tekst pisany kursywą jedynie</p>
jeżeli w pliku arkusza stylu mamy te cztery deklaracje to za każdym razem możemy się nimi posługiwać.

Wygląd akapitu możemy też zdefiniować w lini pliku .html (tzw. wstawianie styli inline)
np.
Cytat:<p style="font-weight: normal; font-style: italic;
text-decoration: underline;">ten akapit będzie kursywą i podkreślony</p>
dla powyższego przykładu akapit będzie kursywą z podkreśleniem.
Napisz po co i kiedy stosuje się css a nie html ; )

Używanie znaczników <b> czy <i> nie jest złe, bardziej trzeba zwrócić uwagę
na <b> a <strong>. W pojedynczym przypadku myślisz, że komuś chce się
otwierać arkusz i wpisywać 3 linijki "font, font font" zamiast jedno <u> w tekście?
Wedle najnowszych trendów wszelkie wyróżnienia powinny być robione za pomocą deklaracji CSS.
Tu opisałem, jak zastosować to z użyciem stylu, dopóki większość przeglądarek obsługuje te standardy, można stosować obie metody.
Z zastrzeżeniem, że dla starych przeglądarek strony muszą być tworzone (w samym html stare ie 4). Dla nowych przeglądarek jest zalecane stosowanie css. Wybór metody uważam, że każdy projektujący może dobrać sobie sam, być może ktoś zamiast stylów i html może chcieć wydrukować stronę używając poleceń javascript, a inny stworzy we flashu, dla nich moja rada będzie nie zbyt przydatna.
To fakt prościej jest w htmlu wstawić odpowiedni kod i mieć spokój niż bawić się w style ale też faktycznie trzeba przyznać że obecnie odchodzi się od stosowania takich wyróżnień, wszędzie gdzie sie nie zerknie stosują ludzie css do upiększania/formatowania tekstu.
Stosuje się css ponieważ w większości przypadków ułatwia to modyfikację serwisu. Zamiast w kilku plikach wprowadzac zmiany dotyczące formatowania tekstu łatwiej zmodyfikowac jeden plik css. Obecnie wygląd szablonu strony znajduje się w pliku zewnętrznym. Nawet w sytuacji, gdy podejrzymy plik z kodem źródłowym i znajdziemy tagi <style> są one dołączane dynamicznie w pliku php.
Przekierowanie