Szablon:Gradient

Z Wikipedii, wolnej encyklopedii
Przejdź do nawigacji Przejdź do wyszukiwania
Template-info.png Dokumentacja szablonu [zobacz] [edytuj] [historia] [odśwież]

Ten szablon tworzy gradient w tle pola ramki.

Obecnie działa w Firefox (3.6 i wyżej), Opera (11,10 i więcej), Safari (4.0 i wyżej), Google Chrome i Internet Explorer 10. W innych przeglądarkach, wyświetla tylko początkowy kolor jako kolor tła.

Użycie[edytuj kod]

Użyj wewnątrz znacznika CSS.

Szablon wykorzystuje background-color i background-image właściwości, więc najlepiej jest umieścić je za innymi background parametrami.

<div style="{{Gradient| #początkowy kolor | #ostatni kolor | [orientacja] | [pośredni kolor [| pozycja zmiany koloru]]}}">Lorem ipsum...</div>

  1. początkowy kolor – Obowiązkowy. Kolor początku gradientu w CSS notacji.
  2. ostatni kolor – Obowiązkowy. Kolor końca gradientu w CSS notacji.
  3. orientacja – Opcjonalny. horizontal (domyślnie) lub vertical, lub zaznaczyć początkową pozycję: left, top, right lub bottom.
  4. pośredni kolor – Opcjonalny. Kolor pośredni między początkowym a końcowym kolorem.
  5. pozycja zmiany koloru – Opcjonalny. Pozycja zmiany koloru pomiędzy 0% and 100%. Domyślnie jest 50%.

Każdy parametr musi być umieszczony na określonej pozycji.

Opis parametrów[edytuj kod]

Przykład[edytuj kod]

  • <div style="{{Gradient|#e8f4ff|#FFFFFF|horizontal}}">Lorem ipsum...</div> da
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
  • <div style="{{Gradient|#ffdddd|#ddddff|horizontal|#ddffdd|50%}}">Lorem ipsum...</div> da
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
  • <div style="{{Gradient|#e8f4ff|#e8f4ff|vertical|white|50%}}{{Promień ramki|16px 8px 16px 8px}}{{Cień ramki}}">Lorem ipsum...</div> da
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Błędy[edytuj kod]

Błędy należy zgłaszać na stronie Wikipedia:Kawiarenka/Kwestie techniczne.

Zobacz też[edytuj kod]