Informacje

Niniejsza strona została sformatowana przy użyciu CSS. Demonstruje trzykolumnowy układ oparty na elementach pływających z zaokrąglonymi rogami.

Koncepcja

Zaokrąglanie rogów uzyskano dzięki dołączeniu skryptu JavaScript Nifty Corners.

Niniejszy przykład wykorzystuje skrypt NiftyCorners, który dodaje elementy div o szerokości jednego piksela, tworząc w ten sposób efekt zaokrąglonych rogów. Więcej na temat tego skryptu można dowiedzieć się na stronie Nifty Corners.

Wstawiłem dodatkowe wywołanie funkcji, które przekazuje lokalizację pliku CSS skryptu Nifty Corners do jego pliku JavaScript. Dzięki temu pliki Nifty Corners mogą znajdować się w dowolnym miejscu.

Pliki biblioteki Stylib

W niniejszym układzie wykorzystano dwa pliki z biblioteki Stylib:

  1. 3_col_rounded.css
  2. text_n_colors.css

Plik XHTML nosi nazwę

Uwaga: Przeglądarka Firefox ma problemy z zaokrąglonymi rogami w elementach z dopełnieniem. Najlepszym rozwiązaniem jest dodanie wewnętrznego elementu div i zastosowanie dopełnienia do niego.

W tle nagłówka użyto obrazu z gradientem i opcji skryptu Nifty 'transparent'