Ciekawostki, porady

CSS otwiera drogę przed webmasterami do uzyskania rewelacyjnych wyników pracy bez użycia dodatkowego oprogramowania, javascript czy flash. Poniżej zaprezentowane zostaną techniki tworzenie stron www z użyciem wysublimowanych sposobów CSS. Zamieszczamy również podstawowe informacje w formie “ściągawki”, które zawsze możesz użyć przy projektowaniu strony internetowej. Nie przedłużając rozpocznijmy zatem prezentację tricków CSS. W tej części postaramy się zaprezentować potęgę znacznika li jak i pół-przeźroczyste tła strony.

1/ Niesamowite <li>

Li jako jeden z podstawowych znaczników jest wykorzystywany przy budowie wszelkich list. Listą mogę być kolejne artykuły, menu czy też zwykłe wypunktowania. W zasadzie cała strona mogłaby być zbudowana “na” znacznikach li, oczywiście nie byłby to kod semantyczny, jakkolwiek jest taka możliwość. Wszystkie profesjonalnie zbudowane strony www używają tego znacznika dla prezentacji menu. Nie ma lepszego rozwiązania aby tworzyć i zaprezentować nawigację w układzie strony. W zasadzie sam xhtml zawsze wygląda tak samo, lecz silnikiem napędzającym jest tu CSS.

2/ Pół-przeźroczyste tła strony

Jeśli chcemy zastosować taki rodzaj tła mamy dwa rozwiązania. Pierwsze z nich to użycie parametru opacity, drugie natomiast to tranparentny plik .png. Pierwsze z nich jest o tyle kłopotliwe, że wraz z przeźroczystością tła tworzymy także przeźroczystość dla tekstów będących ciałem div’a ostylowanego w ten sposób. W takim przypadku można stosować rozwiązanie powielania napisu powiedzmy znacznika h1 przy jednoczesnej pozycji absolutnej tego znacznika (nie chcemy, aby ten sam tekst na stronie www pojawiał się pod sobą, a na sobie). Druga możliwość jak już wspomnieliśmy wcześniej to użycie transparentego pliku png. Problem w tym, że IE 6 nie radzi sobie najlepiej z tego rodzaju plikiem. Microsoft nie popisał się tworząc “łatkę” i aby obejść brak transparencji w tym przypadku należy użyć kodu, który zrozumiały jest tylko dla IE. Powstały dotychczas inne sposoby wymuszenia przeźroczystości na IE, ale zawsze dodatkowe pliki js zajmują miejsce i czas ładowania strony zwiększa się.