Ayuda: Hojas de estilo en cascada

Esta es una página de información . No se trata de un artículo enciclopédico ni de una de las políticas o directrices de Wikipedia ; su propósito es explicar ciertos aspectos de las normas, costumbres, tecnicismos o prácticas de Wikipedia. Puede reflejar distintos niveles de consenso y revisión .

Atajos H:CSS WP:CSS

Las hojas de estilo en cascada permiten dar formato flexible a una página. Se deben utilizar en lugar de tablas para contenido no tabular siempre que sea posible, ya que el lector puede manipularlas o el autor puede anularlas si su CSS está incrustado en otra página a través de una plantilla .

El estilo puede elegirse específicamente para una pieza de contenido, ver por ejemplo, color; alcance de los parámetros

Como alternativa, se especifica el estilo para los selectores CSS, expresado en términos de elementos, clases e identificadores. Esto se hace en varios niveles:

Hojas de estilo del autor, en este orden:

Nota: Consulte WP:CLASS para obtener una lista de todas las hojas de estilo cargadas.

Por skin: Manual de MediaWiki: Galería de estilos de usuario, etc. Hojas de estilo cargadas normalmente:

• común/compartido.css
• común/commonPrint.css

Archivo principal específico de la piel

por ejemplo, monobook/main.css (apariencia normal para PC), chick/main.css (apariencia normal para dispositivos portátiles)

Correcciones específicas del navegador (también específicas de la apariencia)

Ejemplos para Monobook:

• Para Firefox: monobook/FF2Fixes.css
• Para Internet Explorer: monobook/IE60Fixes.css monobook/IE70Fixes.css
• Para Opera: monobook/Opera6Fixes.css monobook/Opera7Fixes.css monobook/Opera9Fixes.css

• Para todo el sitio y para todas las apariencias (solo vista de escritorio): MediaWiki:Common.css
• Sitio web completo para todas las apariencias (solo vista móvil): MediaWiki:Mobile.css
• En todo el sitio por skin: MediaWiki:Vector.css , MediaWiki:Monobook.css , etc.
• Todo el sitio para grupos de usuarios: MediaWiki:Group-user.css , MediaWiki:Group-autoconfirmed.css , etc.
• En todo el sitio para fines especializados: MediaWiki:Print.css , MediaWiki:Noscript.css , MediaWiki:Filepage.css
• En todo el sitio si se cargan gadgets: consulte Wikipedia:Gadget para obtener más información

Nota: Los sitios de MediaWiki que no sean Wikipedia en inglés pueden utilizar MediaWiki:Gadget-site.cssen lugar de MediaWiki:Common.css.

Se pueden introducir hojas de estilo específicas de la página mediante TemplateStyles . Las páginas, en particular las plantillas, también pueden tener CSS en línea.

Algunas páginas tienen su propio CSS, por ejemplo, MediaWiki:FileUploadWizard.css

• Específico del usuario global para todos los aspectos: meta:Special:MyPage/global.css
• Específico del usuario para todas las apariencias: Special:MyPage/common.css
• Específico del usuario por skin: por ejemplo, Special:MyPage/vector.css o Special:MyPage/skin.css para su skin actual
• CSS específico del usuario cargado a través de JavaScript, por ejemplo, cargado en Special:MyPage/common.js
• Configuración del navegador web específica del usuario: archivo local al que se hace referencia en la configuración del navegador o configurado directamente en el navegador

Tenga en cuenta que en la terminología CSS, las hojas de estilo específicas del usuario no son hojas de estilo de usuario .

Un elemento HTML puede ser simplemente tomado del wikitexto (ver HTML en wikitexto ), por ejemplo, span, o el resultado de traducir el wikitexto, por ejemplo, el '''...'''código se cambia a <b>...</b>, o parte del código para el skin.

El software puede producir una clase, por ejemplo, ns- número de espacio de nombres para el elemento HTML "cuerpo", y extiw para un enlace interwiki en el cuerpo de la página, o tomado del wikitexto.

De manera similar, un ID puede ser producido por el software, por ejemplo, bodyContent, o tomado del wikitexto.

En caso de conflicto de configuraciones de estilo para un contenido, la configuración resultante depende principalmente de la indicación "!important". En segundo lugar, si ambas son importantes, gana el usuario, si ninguna lo es, gana el autor. En tercer lugar, depende de la especificidad. Por último, depende del orden entre y dentro de las hojas de estilo: gana el último. Por lo tanto, un User: username /monobook.css no gana de MediaWiki:Monobook.css (ambos autor, no usuario) si la especificidad de este último es mayor. Véase también cascada.

MediaWiki es compatible con la mayoría de los CSS, con excepciones como el atributo url(). En versiones anteriores había algunos errores en la compatibilidad con CSS.

Puede utilizar estilos CSS en elementos HTML en su código (consulte Ayuda:HTML en wikitexto para obtener una lista de elementos compatibles con MediaWiki) como lo haría en el marcado HTML normal.

Por ejemplo, un <div>...</div>elemento con un borde verde y su contenido flotando hacia la derecha se crearía con

< div  style = "float:right; border:thin solid green;" >
Aquí viene un párrafo corto que está < br  />
contenido en un elemento "div" que está < br  />flotó hacia la derecha.</div>​​

que generaría el cuadro de la derecha. Algunos elementos de wikitexto permiten insertar estilos CSS directamente en ellos. Un ejemplo es la sintaxis de la tabla:

{| style = "tu estilo aquí" |- | tus cosas de mesa |} 

Es posible que desees utilizar un tipo de estilo que ya esté predefinido por MediaWiki o por el sitio que estás visitando. También puedes crear un estilo que sea exclusivo para tu página.

Vector es el estilo predeterminado, puedes verlo en: MediaWiki:Vector.css

Le dará a su etiqueta CSS una "clase" existente

Por favor, incluya aquí una lista de clases existentes.

En una página incrustada, se pueden ocultar los comentarios en una versión y mostrarlos en otra vista. Un "estilo" extremo para un texto es no mostrarlo, con

. '' nombre de clase '' { mostrar : ninguno } # '' id '' { mostrar : ninguno }    

etc.

Los enlaces que no se muestran no funcionan (a diferencia de los enlaces en una fuente muy pequeña).

No se puede utilizar para eliminar texto en expresiones de nombres de plantillas, nombres de parámetros, valores de parámetros, nombres de páginas en enlaces, etc.

Para ver el texto oculto, descargue la barra de herramientas para desarrolladores web de Firefox aquí y, a continuación, seleccione Misc. → Mostrar elementos ocultos en esa barra de herramientas. Esto hará que aparezcan todos los elementos ocultos.

Se puede excluir la impresión de contenido declarando que el contenido es de la clase "noprint":

< div  class = "someclass noprint" > Esto no aparecerá en la versión impresa. </ div >

• contenido-de-columna – espacio total dentro de cuyos márgenes existe el contenido.
• firstHeading : la clase de la etiqueta de encabezado en la parte superior de cada página
• contentSub – el nombre de la wiki inmediatamente debajo del encabezado principal, pero encima del cuerpo del texto
• contenido : el cuadro con fondo blanco y borde fino que contiene el contenido de la página principal.
• bodyContent : el contenido de la página principal dentro del cuadro de contenido

La clase portlet es el estilo que utilizan todos los bloques div alrededor del contenido principal. Bloques identificados que utilizan esa clase:

• p-cactions – id para la lista de pestañas relacionadas con la página encima del contenido principal (página, discusión, edición, etc.), parte superior.
• p-personal – id para la lista de enlaces relacionados con el usuario encima del contenido principal (nombre de usuario, discusión, etc.), arriba.
• p-logo – id del bloque que contiene el logotipo, arriba a la izquierda.
• p-navigation – id para el bloque que contiene los enlaces de navegación a la izquierda de la página
• p-search – el bloque que contiene los botones de búsqueda
• p-tb – el bloque que contiene los enlaces de la caja de herramientas
• p-lang – el bloque que contiene enlaces entre idiomas

El pie de página en la parte inferior de la página incluye bloques con los siguientes identificadores

• pie de página – bloque contenedor de pie de página general
• f-poweredbyico : la imagen desarrollada por MediaWiki que normalmente se encuentra a la derecha de la página
• f-list – id de la lista que contiene todos los fragmentos de texto en la parte inferior de la página

Una clase o id puede depender del resultado producido por una plantilla o de un parámetro de plantilla, por ejemplo . Para uno o más de los nombres de clase posibles, se puede definir el estilo de esa clase. Si la clase no está definida, se ignora, por lo que se utiliza el estilo estándar.class="abc{{{1|def}}}"

En el caso más simple, tenemos eg y definimos la clase abcdef. Si el valor del parámetro es "def", se aplica.class="abc{{{1}}}"

Si una página para uso general solo tiene sentido cuando se definen estilos para ciertas clases, entonces estos deben especificarse en la página MediaWiki:Common.css , que se aplica a todos los usuarios y todas las apariencias, siempre que no se anulen.

Wikitexto que se lee

< span  style = "display:{{{3|none}}}" > miércoles </ span >

Se mostrará "Wed" si el parámetro 3 está definido, pero su valor no es "none", y no se mostrará nada si el parámetro 3 no está definido o es "none". Si el valor del parámetro 3 es un estilo de visualización distinto de "none", se aplicará ese estilo.

Los encabezados wiki utilizan el siguiente CSS predeterminado:

color : # 000000 ; fondo : ninguno ; desbordamiento : oculto ; salto de página después : evitar ; tamaño de fuente : 1,8em ; familia de fuentes : 'Linux Libertine' , Georgia , Times , serif ; margen superior : 1em ; margen inferior : 0,25em ; altura de línea : 1,3 ; relleno : 0 ; borde inferior : 1px sólido # AAAAAA ;                       

color : # 000000 ; fondo : ninguno ; desbordamiento : oculto ; salto de página después : evitar ; tamaño de fuente : 1,5em ; familia de fuentes : 'Linux Libertine' , Georgia , Times , serif ; margen superior : 1em ; margen inferior : 0,25em ; altura de línea : 1,3 ; relleno : 0 ; borde inferior : 1px sólido # AAAAAA ;                       

color : # 000000 ; fondo : ninguno ; desbordamiento : oculto ; salto de página después : evitar ; tamaño de fuente : 1,2em ; peso de fuente : negrita ; margen superior : 0,3em ; margen inferior : 0 ; altura de línea : 1,6 ; relleno superior : 0,5em ; relleno inferior : 0 ;                     

color : # 000000 ; fondo : ninguno ; desbordamiento : oculto ; salto de página después : evitar ; tamaño de fuente : 100 %; peso de fuente : negrita ; margen superior : 0,3 em ; margen inferior : 0 ; altura de línea : 1,6 ; relleno superior : 0,5 em ; relleno inferior : 0 ;                     

color : # 000000 ; fondo : ninguno ; desbordamiento : oculto ; salto de página después : evitar ; tamaño de fuente : 100 %; peso de fuente : negrita ; margen superior : 0,3 em ; margen inferior : 0 ; altura de línea : 1,6 ; relleno superior : 0,5 em ; relleno inferior : 0 ;                     

color : # 000000 ; fondo : ninguno ; desbordamiento : oculto ; salto de página después : evitar ; tamaño de fuente : 100 %; peso de fuente : negrita ; margen superior : 0,3 em ; margen inferior : 0 ; altura de línea : 1,6 ; relleno superior : 0,5 em ; relleno inferior : 0 ;                     

• Span y div
• Hojas de estilo en cascada : artículo sobre CSS
• Wikipedia:Personalización : también cubre nombres de usuario, configuraciones de preferencias, máscaras, scripts de usuario, etc.
• Ayuda: Estilo de usuario : modificar el estilo para accesibilidad o para probar funciones adicionales.
• Wikipedia:TemplateStyles – modificación de estilo para una apariencia visual avanzada que se puede aplicar con la plantilla.
• Wikipedia:Catálogo de clases CSS : lista de clases definidas globalmente en todo el sitio
• Wikipedia:WikiProject Microformatos/clases : lista de clases utilizadas en microformatos empleados en Wikipedia
• Ayuda: CSS de usuario para una fuente de codificación monoespaciada , tanto para la ventana de edición como para la visualización de elementos monoespaciados como<code>
• meta:Ayuda:Hojas de estilo en cascada
• mw:Manual:CSS y mw:Manual:Interfaz/Hojas de estilo
• mw:Galería de estilos de usuario
• m:Personalización:Explicación de las máscaras
• mw:Proyectos de piel