Mall:Gradient
[visa] [redigera] [rensa sidcachen]
Dokumentation
Den här mallen skapar en gradient-bakgrund. Den fungerar för närvarande i Firefox (3.6 och senare), Opera (11.10 och senare), Safari (4.0 och senare), Google Chrome och Internet Explorer 10. I andra webbläsare visas startfärgen som bakgrundsfärg.
Användning
[redigera wikitext]Mallen används inom CSS-taggar. Mallen använder egenskaperna background-color och background-image, så placera mallen efter de andra background-egenskaperna.
Tänk på att nedanstående exempel använder färger med hög kontrast för att visa effekten tydligare. Det är bäst att använda subtila färgskillnader för att förbättra utseendet, snarare än att radikalt förändra det. Subtila färgskillnader minskar också effekten på webbläsare som inte stöder gradienter.
Parametrar
[redigera wikitext]<div style="{{gradient | #start color | #end color | [orientation] | [stop color [| stop position]]}}">Lorem ipsum...</div>
- start color - Obligatorisk. Startfärgen i gradienten i CSS-format.
- end color - Obligatorisk. Slutfärgen i gradienten i CSS-format.
- orientation - Frivillig. horizontal (standard) eller vertical, eller specificera startpunkt: left, top, right eller bottom.
- stop color - Frivillig. Mellanfärg mellan start- och slutfärg.
- stop position - Frivillig. Slutfärgens position, mellan 0% och 100%. Standard är 50%.
Parametrarna måste placeras på sin fasta plats.
Exempel
[redigera wikitext]- <div style="{{gradient|#ffdddd|#ddddff|horizontal}}">Lorem ipsum...</div> ger
- <div style="{{gradient|#ffdddd|#ddddff|horizontal|#ddffdd|50%}}">Lorem ipsum...</div> ger
- <div style="{{gradient|#ffdddd|#ddddff|vertical}}">Lorem ipsum...</div> ger
Se även
[redigera wikitext]{{border-radius}}