Przejdź do treści

Centrum Kształcenia Zawodowego i Ustawicznego w Mrągowie

Alternatywne arkusze stylów

piątek,

Alternatywne arkusze stylów

W zamyśle twórców standardów dokument HTML może mieć kilka alternatywnych stylów CSS. W myśl tej idei ostateczna decyzja w sprawie zastosowanego arkusza należy do użytkownika. Niestety obecnie opcja ta jest słabo wspierana przez przeglądarki, z tych najpopularniejszych jedynie Firefox oferuje specjalne menu do przełączania arkuszy stylów, w większości pozostałych przypadków należy stosować dodatkowe wtyczki. Trudno oczekiwać, że każdy użytkownik zadba o takie rozwiązanie, dlatego można je traktować jako ciekawostkę.

Na poniższym zrzucie ekranu widać menu przełączania arkuszy stylów w programie Firefox. Menu aplikacji można przywołać za pomocą lewego klawisza alt.

Menu przełączania stylów

Aby dołączyć do dokumentu alternatywne arkusze stylów, należy umieścić w nagłówku strony kolejne elementy link mające właściwe atrybuty rel i title. Na podstawie atrybutu title zostaną nadane etykiety w menu przełączania stylów. W przypadku powtórzonych identycznych wartości title odpowiednie pliki zostaną połączone w jeden arkusz. Atrybut rel o wartości stylesheet oznacza domyślnie przyjmowany arkusz, jego alternatywy powinny otrzymać wartość „alternate stylesheet”. Wszystko jest widoczne w przykładowym kodzie.

Kod HTML przykładowej strony:

<!DOCTYPE html>
<html lang="pl">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Alternatywne arkusze stylów</title>
  <link rel="stylesheet" href="start.css" title="Standard">
  <link rel="stylesheet" href="red.css" title="Czerwony">
  <link rel="stylesheet" href="black.css" title="Czarny">
</head>
<body>
  <p>Lorem...</p>
</body>
</html>

Plik start.css:

* {
  background: #eee;
  color: #000;
}

Plik red.css:

* {
  background: #f00;
  color: #fff;
}

Plik black.css:

* {
  background: #000;
  color: #fff;
}
Artykuł: Operacja Biting

Operacja Biting

Artykuł: Generał Roman Abraham

Generał Roman Abraham

Artykuł: Kazimierz Heilman-Rawicz

Kazimierz Heilman-Rawicz

Artykuł: Kopiowanie plików z pomocą SCP

Kopiowanie plików z pomocą SCP

Artykuł: Klient SFTP Filezilla

Klient SFTP Filezilla

Artykuł: Odwrócenie kolorów obrazu na&nbsp;wydruku

Odwrócenie kolorów obrazu na wydruku

Nasze technikum

Technik informatyk

Szkoły dla dorosłych

Nasza szkoła

Pełna oferta edukacyjna

Oferta szkoły