De Wikipedia, la enciclopedia libre
Saltar a navegación Saltar a búsqueda

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

Niveles de configuración de CSS [ editar ]

El estilo se puede elegir específicamente para una parte del contenido, ver, por ejemplo, color; alcance de los parámetros

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

Hojas de estilo de autor, en este orden:

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

Hojas de estilo principales de MediaWiki [ editar ]

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

Archivo principal específico de la piel

por ejemplo, monobook / main.css (piel normal para PC), chick / main.css (piel normal para computadoras de mano)

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

Ejemplos de Monobook:

Hojas de estilo para todo el sitio [ editar ]

  • Todo el sitio para todas las máscaras (solo vista de escritorio): MediaWiki: Common.css
  • Todo el sitio para todas las máscaras (solo vista móvil): MediaWiki: Mobile.css
  • Todo el sitio por máscara : MediaWiki: Vector.css , MediaWiki: Monobook.css , etc.
  • Todo el sitio para grupos de usuarios: MediaWiki: Group-user.css , MediaWiki: Group-autoconfirmed.css , etc.
  • 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 usar en MediaWiki:Gadget-site.csslugar de MediaWiki: Common.css.

Hojas de estilo específicas de la página [ editar ]

Las hojas de estilo específicas de la página se pueden introducir a través de 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

Hojas de estilo específicas del usuario [ editar ]

  • Específico del usuario global para todas las máscaras: meta: Special: MyPage / global.css
  • Específico del usuario para todas las máscaras : Especial: MyPage / common.css
  • Específico del usuario por máscara : por ejemplo, Especial: MyPage / vector.css , o Especial: MyPage / skin.css para su máscara actual
  • CSS específico del usuario cargado a través de JavaScript, por ejemplo, cargado en Special: MyPage / common.js
  • Configuración del navegador para toda la 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 del usuario.

Uso [ editar ]

Un elemento HTML puede ser tomado del wikitext (ver HTML en wikitext ), por ejemplo, span, o el resultado de la traducción de wikitext, por ejemplo, el '''código se cambia a <b>, o parte del código para la máscara.

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

De manera similar, el software puede generar una identificación, por ejemplo, bodyContent, o tomarse del wikitext.

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

Elementos compatibles [ editar ]

MediaWiki admite la mayoría de CSS, con excepciones como el atributo url (). Hubo algunos errores en el soporte de CSS en versiones anteriores.

CSS en wikitexto [ editar ]

Puede usar estilos CSS en elementos HTML en su código (consulte Ayuda: HTML en wikitext para obtener una lista de elementos admitidos por MediaWiki) como lo haría en el marcado HTML normal.

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

< div  style = "float: right; border: thin solid green;" >
Aquí viene un párrafo corto que es < br  />
contenido en un elemento "div", es decir < br  />flotaba a la derecha.</ div >

Aquí viene un párrafo corto que está
contenido en un elemento "div" que
flota a la derecha.

que produciría la caja de la derecha. Algunos elementos de wikitexto le permiten insertar estilos CSS directamente en ellos. Un ejemplo es la sintaxis de la tabla:

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

Estilos existentes de MediaWiki [ editar ]

Es posible que desee utilizar un tipo de estilo que ya esté predefinido por MediaWiki o el sitio que está visitando. También puede crear un estilo que sea exclusivo de su página.

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

Dará a su etiqueta CSS una "clase" existente

Ponga una lista de las clases existentes aquí.

Consejos y trucos [ editar ]

Sin pantalla [ editar ]

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

. classname {display: none}# id {display: none}

etc.

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

No se puede utilizar para eliminar texto en expresiones para 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 para Firefox aquí , luego elija Misc. -> mostrar elementos ocultos en esa barra de herramientas. Hará que aparezcan todos los elementos ocultos.

No impreso [ editar ]

Se puede excluir el contenido de la impresión (si el navegador admite CSS) declarando que el contenido es de la clase "noprint":

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

Bloques de estilo principales [ editar ]

Una captura de pantalla de escritorio anotada de un artículo de ejemplo , que muestra los bloques de estilo
  • column-content - espacio total dentro de los márgenes de los cuales existe el contenido.
  • firstHeading : la clase de la etiqueta de título 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 : fondo blanco, cuadro de 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 de portlet es el estilo utilizado por todos los bloques div alrededor del contenido principal. Bloques identificados usando esa clase:

  • p-cactions : id de la lista de pestañas relacionadas con la página sobre el contenido principal (página, conversación, edición, etc.), arriba.
  • p-personal : id de la lista de enlaces relacionados con el usuario sobre el contenido principal (nombre de usuario, conversación, etc.), arriba.
  • p-logo - ID del bloque que contiene el logo, arriba a la izquierda.
  • p-navigation : id del 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 de contenedor de pie de página general
  • f-poweredbyico : la imagen impulsada 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

Estilo según parámetro o variable [ editar ]

Clase o id de variable [ editar ]

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

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

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 máscaras, en la medida en que no se anulen.

Valor del parámetro de estilo variable [ editar ]

Wikitexto que dice

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

mostrará "Mié" si el parámetro 3 está definido, pero su valor no es "ninguno", y no muestra nada si el parámetro 3 no está definido o "ninguno". Si el valor del parámetro 3 es un estilo de visualización distinto de "ninguno", se aplica ese estilo.

Encabezados de wiki [ editar ]

Los encabezados de wiki utilizan el siguiente CSS predeterminado:

Ver también [ editar ]

  • Span y div
  • Hojas de estilo en cascada : artículo sobre CSS
  • Wikipedia: Personalización : también cubre nombres de usuario, configuración de preferencias, máscaras, secuencias de comandos de usuario, etc.
  • Ayuda: Estilo de usuario: estilo de modificación para accesibilidad o para pruebas de funciones adicionales.
  • Wikipedia: TemplateStyles : estilo de modificación 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: Microformatos / clases de WikiProject: lista de clases utilizadas en los 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: Cascading_style_sheets
  • mw: Manual: CSS y mw: Manual: Interfaz / Hojas de estilo
  • mw: Galería de estilos de usuario
  • m: Personalización: Explicación de máscaras
  • mw: proyectos de piel