Ayuda:HTML en el wikitexto

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

El código a utilizar para muchos de los elementos HTML mostrados aquí se puede sustituir por wikitexto como se muestra en Ayuda:Edición. Esta página explica el código HTML que se puede usar al editar, para aquellas situaciones en los que la alternativa en código tipo wikitexto no es posible, como por ejemplo el crear un enlace a un elemento particular dentro de una tabla o dar formato avanzado a determinado texto.

Etiquetas HTML permitidas[editar]

Las siguientes etiquetas son permitidas:

<abbr> 
Una abreviación (por ejemplo, WWW, HTML).
<b> 
Texto que desentona estilísticamente con el resto del texto sin atribuir especial importancia.
<big> 
Indica la representación en un tamaño de fuente más grande.
<blockquote> 
Una sección de material citado,

suele presentarse como un bloque con sangría,

por lo general para citas largas
<br> 
Un salto de línea
en medio del texto, como en la poesía o las direcciones.
<caption> 
Una captura de la tabla
   
<center>  
Indica la presentación de un bloque alineado centralmente.
<cite> 
Título de la obra (e.g., HTML en el wikitexto)
<code> 
Un fragmento de código informático
<dd> 
Un valor
en una lista de asociaciones marcada con la etiqueta<dd>
<del> 
Indica una supresión
<dfn> 
Marca un termino definido: un término que se define en el texto.
<div> 
Una división del texto, suele presentarse como un bloque
<dl> 
Una lista de nombres asociados a valores (por ejemplo, términos y definiciones, o propiedades y datos)
<dt> 
Un valor
en una lista de asociaciones marcada con la etiqueta <dt>
<em> 
Para lograr énfasis
<font> (obsoleto) 
Indica la presentación con un color de fuente, tipo de letra y/o un tamaño.
<h1> - <h6> 

Títulos de secciones a diferentes niveles.

<hr> 
Un salto de párrafo a nivel temático, como una transición a un tema diferente

Por lo general, representada por una línea horizontal.

<i> 
El texto está representado en una voz alternativa o estado de ánimo, por lo general representado en itálicas
<ins> 
Indica una inserción
<kbd> 
Indica un texto a ser ingresado por el usuario.
<li> 
  • Un elemento de lista en listas ordenadas (ol)
  • o sin orden (ul)
<ol> 
  1. Una lista ordenada...
  2. o numerada
<p> 
Indica un

párrafo o punto y aparte en un párrafo.

(Los párrafos normalmente están indicados por Wiki markup.)

<pre> 
Representa un bloque de
texto preformateado
<rb> (obsoleto) 
Anteriormente usado para marcar texto base en una anotación de Ruby.
<rp> 
Marca paréntesis de Ruby, una forma alternativa de anotar en Ruby: (hàn)() se puede renderizar como 汉 (hàn) 字 (zì)
<rt> 
Marca una anotación en 汉Ruby 
<ruby> 
Una anotación de Ruby: hàn
<samp> 
Representa una muestra, por ejemplo de un programa o código.
<s> o <strike> (ambos desaprobados) 
Indica que el texto ha dejado de ser relevante.
<small> 
Indica una letra pequeña como la de documentos legales o anuncios.
<span> 
Una división del texto, normalmente presentada rodeada de texto.
<strong> 
Enfatiza una gran importancia, normalmente presentada en negrita.
<sub> 
Indica unsubíndice
<sup> 
Indica unsuperíndice
<table> 

Identifica una tabla

<td> 
Una celda de datos para la tabla
<th> 
Una celda de encabezado para la tabla, el contenido se muestra convencionalmente en negrita y en posición centrada
<tr> 

Contiene una fila de celdas en una tabla

<tt> (obsoleto)
Indica presentación en una fuente de ancho fijo
<u> (obsoleto)
Indica una anotación no-textual, típicamente reprensentada por una subrayación
<ul>
  • Una lista sin orden...
  • pero con marcas
<var> 
Indica una variable
<!-- ... --> (Se eliminará durante el procesamiento) 
<!--Comentario no visible-->

Enlaces de anclaje[editar]

Las etiquetas HTML permitaen un atributo de id que puede ser referido en un CSS propio de usuario user style, y permite que el elemento se use como objetivo de enlace.

Sin embargo, el elemento de anclaje a no está permitido, da modo que el wikitexto

<a href="http://meta.wikimedia.org/">Main Page</a>

es tratado como el wikitexto

&lt;a href="http://meta.wikimedia.org/"&gt;Main Page&lt;/a&gt;

y por tanto es representado como

<a href="http://meta.wikimedia.org/">Main Page</a>

lo cual no es probablemente la intención del editor. En lugar del elemento de anclaje (<a>) la marca wiki para referencias externas es requerida (entre corchetes con la URL separada de los contenidos por un solo espacio:

[http://meta.wikimedia.org/ Main Page]

queda representado como:

Main Page

El siguiente extracto de Sanitizer.php muestra que atributos son permitidos.

$htmlpairsStatic = array( # Etiquetas que deben cerrarse
    'b', 'del', 'i', 'ins', 'u', 'font', 'big', 'small', 'sub', 'sup', 'h1',
    'h2', 'h3', 'h4', 'h5', 'h6', 'cite', 'code', 'em', 's',
    'strike', 'strong', 'tt', 'var', 'div', 'center',
    'blockquote', 'ol', 'ul', 'dl', 'table', 'caption', 'pre',
    'ruby', 'rt' , 'rb' , 'rp', 'p', 'span', 'u', 'abbr'
);
$htmlsingle = array(
    'br', 'hr', 'li', 'dt', 'dd'
);
$htmlsingleonly = array( # Elementos que no pueden tener etiqutas de cerrado
    'br', 'hr'
);
$htmlnest = array( # Etiquetas que pueden ser anidadas--??
    'table', 'tr', 'td', 'th', 'div', 'blockquote', 'ol', 'ul',
    'dl', 'font', 'big', 'small', 'sub', 'sup', 'span'
);
$tabletags = array( # Sólo pueden aparecer dentro de una tabla, nosotros la cerraremos
    'td', 'th', 'tr',
);
$htmllist = array( # Etiquetas usadas por listas
    'ul','ol',
);
$listtags = array( # Etiquetas que pueden aparecer en una lista
    'li',
);

Etiquetas[editar]

<span> es un contenedor de texto genérico.

<font> es una etiqueta similar que es desaprobada (no debería ser usada) en favor de <span>.

Por ejemplo

una palabra de color <font color="red">rojo</font>.

produce el mismo resultado que

una palabra de color <span style="color:red">rojo</span>.

Véase tambiénm:Help:Text color.

Es inútil combinar la antigua etiqueta <font> con CSS; los navegadores antiguos ignorarían el CSS, mientras que los navegadores modernos usan <span> (véase arriba).

Nótese que, en la mayoría de los casos, se puede usar una etiqueta más descriptiva, por ejemplo, <strong> para indicar la importancia de un trozo de texto, o <em> (sujeta a las mismas condiciones que strong) para indicar un trozo de texto enfatizado.

Esto no sólo llama la atención del lector al trozo de texto, sino que también alerta a aquellos que usan un navegador no-visual o con limitaciones de visión, etc el hecho de que es un texto enfatizado.

Usando <span> como enlace de anclaje[editar]

La manera estándar de mostar un anclaje con nombre como un objetivo invisble (i.e. <a name="Foo">) no funciona (dado que todas las etiquetas <a> son convertidas), y una alternativa sugerida por el W3C, <hN id="Foo"></hN>, produce un enlace "[Edit]".

Sin embargo, <span id="Foo"/> produce un objetivo que puede ser el destino de un enlace target that can be the destination of a link. (ESto es discretamente cambiado a <span id="Foo"></span>). Este es el método usado por la plantilla {{anchor}}. Nótese que no funciona en todos sitios; por ejemplo, en una tabla, tiene que estar dentro de una celda para que algunos navegadores puedan saltar al enlace.

Esta técnica puede ser usada para producir enlaces inmutables de un artículo a una sección de otro, los cuales siguen funcionando incluso si el nombre de la sección es cambiado por alguien que no se percató de que otro artículo enlaza ahí. Por ejemplo, <span id="enlace inmutable de un Artículo"/>.

<div>[editar]

<div> es un contenedor de bloques genérico. Reglas:

  • <div> debe estar seguido por una nueva linea
  • </div> debe ser predecido por una nueva linea
  • </div> seguido de texto en la misma liena, dos lineas o texto antes de <div> en lka misma linea debería ser evitado (ya que dos lineas nuevas producen un solo espacio).

Atributos[editar]

La mayoría de las etiquetas pueden tener el atributo style. Por ejemplo

<div style="font-size:80%">
Esto es texto <span style="color:red">rojo</span>.
</div>

produce:

Esto es texto rojo.

La mayoría de las etiquetas pueden tener clases e IDs. Pueden ser usadas conjuntamente con hojas de estilo para dar una clase descriptiva (o identificador único) a un trozo de texto y para referirse a el mismo en la hoja de estilo. Por ejemplo

<div class="infobox">Caja de información de ejemplo</div>
Caja de información de ejemplo

Produce una caja que flota en la derecha por que la clase infobox ya está definida localmente en Mediawiki:Common.css.

Las clases e IDs también pueden ser usadas por código de Javascript. Por ejemplo, véase how {Link FA} works en enwiki (inglés).

Etiquetas con efectos especiales[editar]

Pre[editar]

Las etiquetas <pre> funcionan como la combinación de <nowiki> y la etiqueta estándar de HTML <pre>: El contenido estará preformateado, y no se parseará, pero será mostrado como en la fuente de WikiTexto. Si se quiere texto preformateado pero parseado, se deberá usar un espacio al principio de la linea. Por ejemplo,

<pre>Esta palabra está en <b>negrita</b>.</pre>
  Esta palabra está en <b>negrita</b>.

se renderizará como

Esta palabara está en <b>negrita</b>.
Esta palabara está en negrita.

Comentarios[editar]

Comentarios de HTML en el wikitexto(<!-- ... -->) No aparecerán en el código HTML.

Encabezados[editar]

Los encabezados (<h1>...<h6>) serán tratados de forma similar a los encabezados de WikiCode:

Encabezado de ejemplo

Nótese que aparece en el Índice y que tiene un enlace de edición acompañante. Aun así hay ciertas diferencias: editar una de estas secciones no auto-rellenerá el resumen de edición, y el navegador no saltará al principio de la sección cuando se guarde la página. Por esta razón se recomienda usar los equivalentes de WikiTexto.

Excepciones[editar]

En algunas páginas del espacio de nombres MediaWiki (normalmente los pequeños mensajes como los rótulos en los botones) el código HTML no funciona. Por ejemplo, <span id=abc> produce el HTML &lt;span id=abc&gt; renderizado por el navegador como <span id=abc>. Otros son interpretados como HTML puro (por lo tanto cualquier etiqueta puede ser usada, pero el WikiCode no será transformado a HTML).

Páginas propias de usuarios de CSS y JS (véase Help:User style) son interpretadas como si estuvieran dentro de un bloque <pre>. Desde MW 1.11 esto también incluye todas los CSS/JS dentro de la página; en versiones anteriores, se tiene que añadir manualmente /*<pre>*/ al principio y añadir /*</pre>*/ al final de esas páginas para evitar renderizados extraños.

Validación[editar]

El software MediaWiki intenta suprimir los errores de HTML, pero no los puede cubrir todos. Si usas HTML en WikiTexto, se recomienda verificar este con W3C Markup Validation Service.

Etiquetas de extensión y análisis sintáctico[editar]

El software de MediaWiki añade elementos que parecen y actúan como etiquetas HTML. Las etiquetas parseadoras están incluidas en MediaWiki mientras que las etiquetas de extensión son añadidas por software de extensiones opcionales.

Etiquetas parseadoras 
<gallery></gallery>, <nowiki></nowiki>, <pre></pre>, <source></source>
Etiquetas de extensión 
<categorytree></categorytree>, <charinsert></charinsert>, <hiero></hiero>, <imagemap></imagemap>, <inputbox></inputbox>, <math></math>, <poem></poem>, <ref></ref>, <references></references>, <syntaxhighlight></syntaxhighlight>, <timeline></timeline>

Enlaces externos[editar]