Plantilla:Degradado/uso
Esta plantilla permite crear un fondo degradado. Los fondos generados por esta plantilla funcionan en Firefox (3.6 o superior), Opera (11.10 o superior), Safari (4.0 o superior) Google Chrome/Chromium (todas las versiones) e Internet Explorer (10.0). En los navegadores no compatibles, la plantilla muestra el primer color del degradado como fondo.
Uso
[editar]Utiliza esta plantilla dentro de definiciones CSS. La plantilla usa las propiedades background-color y background-image, así que la mejor práctica es usarla antes de cualquier otra propiedad background.
<div style="{{degradado | #color inicial | #color final | [orientación] | [detención de color [| posición de la detención]]}}">El veloz murciélago hindú...</div>
- color inicial - Obligatorio. El color inicial del degradado en notación CSS (hexadecimal o RGBA).
- color final - Obligatorio. El color final del degradado en notación CSS (hexadecimal o RGBA).
- orientación - Opcional. horizontal (predeterminado) or vertical, o especifica el punto inicial: left (izquierda), top (arriba), right (derecha) o bottom (abajo).
- detención de color - Opcional. Color intermedio entre los colores inicial y final.
- posición de la detención - Opcional. La posición de la detención de color entre 0% y 100%. La predeterminada es 50%.
Cada parámetro debe colocarse en su posición respectiva, de lo contrario la plantilla no funcionará.
Ejemplos
[editar]- <div style="{{degradado|#ffdddd|#ddddff|horizontal}}">Lorem ipsum...</div> producirá
- <div style="{{degradado|#ffdddd|#ddddff|horizontal|#ddffdd|50%}}">Lorem ipsum...</div> producirá
- <div style="{{degradado|#ffdddd|#ddddff|vertical}}">Lorem ipsum...</div> producirá
Consideraciones
[editar]Los ejemplos anteriores usan colores contrastantes para que el efecto se note más claramente. Sin embargo, es mejor utilizar colores similares para crear diferencias sutiles que mejoran la apariencia del degradado y ayudan a disimular el efecto en navegadores no compatibles.