Alternatywny arkusz stylów <link "alternate stylesheet">
W jaki sposób dać użytkownikowi możliwość wyboru jednego z przygotowanych arkuszy CSS, czyli wyglądu strony?
<head> <link rel="stylesheet" href="style.css" title="Nazwa domyślna"> <link rel="alternate stylesheet" href="style1.css" title="Nazwa 1"> <link rel="alternate stylesheet" href="style2.css" title="Nazwa 2"> <link rel="alternate stylesheet" href="style3.css" title="Nazwa 3"> (...) </head>
- style.css
- Domyślny arkusz stylów, który zostanie wyświetlony na starcie.
- Nazwa domyślna
- Nazwa domyślnego stylu.
- style1.css, style2.css, style3.css
- Alternatywne arkusz stylów - żaden z nich nie zostanie dołączony automatycznie, a jedynie po wyborze odpowiedniej opcji w przeglądarce przez użytkownika.
- Nazwa 1, Nazwa 2, Nazwa 3
- Nazwy alternatywnych arkuszy. Jeżeli kilka alternatywnych arkuszy będzie posiadało taką samą nazwę, zostaną one zgrupowane w jedną opcję wyboru, której zaznaczenie spowoduje dołączenie wszystkich takich arkuszy jednocześnie.
Alternatywny arkusz stylów pozwala udostępnić użytkownikowi kilka wersji wyglądu strony do wyboru. Projektuje się wtedy kilka zewnętrznych arkuszy CSS, a następnie osadza w specjalny sposób, dzięki czemu w przeglądarce użytkownika pojawi się możliwość wyboru jednego spośród przygotowanych wyglądów. Jest to namacalny dowód potęgi języka CSS. Nie trzeba tworzyć, a potem aktualizować kilku wersji witryny, aby zapewnić użytkownikom możliwość dopasowania jej do własnych oczekiwań. Aby dodać nowy wygląd, wystarczy tylko przygotować dodatkowy plik *.css, a zmiana treści serwisu nie będzie wymagała żadnych modyfikacji wyglądu poszczególnych stylów.
Jeśli chcemy, aby niektóre arkusze nie były dostępne do podmiany przez użytkownika, wystarczy osadzić je w tradycyjny sposób, tzn. jako arkusze domyślne bez podania atrybutu title="...". Taki arkusz domyślny, nawet po wyborze przez użytkownika arkusza alternatywnego, nadal będzie wpływał na wygląd strony, a alternatywny zostanie do niego dopisany.
Niestety współczesne popularne przeglądarki nie obsługują alternatywnych arkuszy stylów, jednak osadzenie ich w podany sposób nie powoduje błędów w wyświetlaniu strony. Dodatkowym rozwiązaniem może być skrypt Skórki, który ponadto zapamiętuje wybór dokonany przez użytkownika przy przechodzeniu pomiędzy stronami.