Diferencia entre revisiones de «Enmarcado de código»

De Wikitronica
Saltar a: navegación, buscar
(→‎Enmarcado)
 
(No se muestran 11 ediciones intermedias de 2 usuarios)
Línea 1: Línea 1:
−
=Enmarcado=
+
Para enmarcar código, es posible utilizar los comandos "pre", "source" y "syntaxhighlight", sin embargo, pre, ofrece menos prestaciones para el código que source, y a su vez, syntaxhighlight es mas moderno que source.
−
Para enmarcar código, es posible utilizar los comandos "pre" y "source", sin embargo, pre, ofrece menos prestaciones para el código que source, dado que "pre" muestra el contenido sin formato, en cambio, con "source" y la directiva "lang" se puede elegir entre diversos lenguajes de programacion para que el texto se muestre resaltado como debe ser.
+
El comando "pre" muestra el contenido sin formato, en cambio, con "source" y "syntaxhighlight", junto con la directiva "lang", se puede elegir entre diversos lenguajes de programación para que el texto se muestre resaltado como debe ser.
  
 +
 +
 +
En esta wiki syntaxhighlight será preferido para código.
 
Ejemplo "pre"
 
Ejemplo "pre"
 +
 +
 +
<pre>
 +
<pre>
 +
//yo soy código en C
 +
int hornear(int potato)
 +
{
 +
if(potato<10) potato++;
 +
return(potato)
 +
}
 +
</pre>
 +
 +
Producirá
  
 
<pre>
 
<pre>
Línea 15: Línea 31:
 
Ejemplo "source"
 
Ejemplo "source"
  
 +
 +
<pre>
 
<source lang="c">
 
<source lang="c">
 
//yo soy código en C
 
//yo soy código en C
Línea 23: Línea 41:
 
}
 
}
 
</source>
 
</source>
 +
</pre>
  
 +
Producirá
  
 +
<source lang="c">
 +
//yo soy código en C
 +
int hornear(int potato)
 +
{
 +
if(potato<10) potato++;
 +
return(potato)
 +
}
 +
</source>
  
−
Ahora, como se pudo notar, source no enmarca automáticamente el código, para lo cual entonces se debe usar codigo CSS.
+
Ejemplo "syntaxhighlight"
  
 +
<pre>
 +
<syntaxhighlight lang="c">
 +
//yo soy código en C
 +
int hornear(int potato)
 +
{
 +
if(potato<10) potato++;
 +
return(potato)
 +
}
 +
</syntaxhighlight>
  
 +
</pre>
  
 +
Producirá
  
−
Ejemplo:
+
<syntaxhighlight lang="c">
−
{| style="background:rgb(230,230,230);color:black; solid gray; font-family: fixedsys;" cellpadding=20px cellspacing=0 align=lefth width=0%
+
//yo soy código en C
 +
int hornear(int potato)
 +
{
 +
if(potato<10) potato++;
 +
return(potato)
 +
}
 +
</syntaxhighlight>
 +
 
 +
También se puede usar codigo CSS para sombrear o enmarcar contenido.
 +
 
 +
Ejemplo 1:
 +
<pre>
 +
{| style="background:rgb(230,230,230);color:black; solid gray; font-family: fixedsys; border-style:solid; border-width:5px;" cellpadding=20px cellspacing=0 align=lefth width=0%
 
|
 
|
 +
<source lang="c">
 +
//yo soy código en C
 +
int hornear(int potato)
 +
{
 +
if(potato<10) potato++;
 +
return(potato)
 +
}
 +
|}
 +
 +
</source>
 +
</pre>
 +
 +
Producirá
 +
 +
{| style="background:rgb(230,230,230);color:black; solid gray; font-family: fixedsys; border-style:solid; border-width:5px;" cellpadding=20px cellspacing=0 align=lefth width=0%
 +
|
 +
<source lang="c">
 +
//yo soy código en C
 +
int hornear(int potato)
 +
{
 +
if(potato<10) potato++;
 +
return(potato)
 +
}
 +
</source>
 +
|}
 +
 +
Ejemplo 2:
 
<pre>
 
<pre>
 +
{| style="background:rgb(230,230,230);color:black; solid gray; font-family: fixedsys; " cellpadding=20px cellspacing=0 align=lefth width=0%
 +
|
 +
<source lang="c">
 +
//yo soy código en C
 +
int hornear(int potato)
 +
{
 +
if(potato<10) potato++;
 +
return(potato)
 +
}
 +
|}
 +
</source>
 +
</pre>
 +
 +
Producirá
  
 
{| style="background:rgb(230,230,230);color:black; solid gray; font-family: fixedsys;" cellpadding=20px cellspacing=0 align=lefth width=0%
 
{| style="background:rgb(230,230,230);color:black; solid gray; font-family: fixedsys;" cellpadding=20px cellspacing=0 align=lefth width=0%
Línea 45: Línea 137:
 
return(potato)
 
return(potato)
 
}
 
}
 +
 
</source>
 
</source>
 
|}
 
|}
−
</pre>
+
 
 +
Ejemplo 3:
 +
 
 +
<pre>
 +
{| style="border:1px solid #000; background:#F3F3F3; vertical-align:top; color:#000; -moz-border-radius:2px; -webkit-border-radius: 2px; border-radius: 2px" cellpadding=20px cellspacing=0 align=lefth width=0%
 +
|
 +
<source lang="c">
 +
//yo soy código en C
 +
int hornear(int potato)
 +
{
 +
if(potato<10) potato++;
 +
return(potato)
 +
}
 +
</source>
 
|}
 
|}
 +
</pre>
  
 
Producirá
 
Producirá
  
−
{| style="background:rgb(230,230,230);color:black; solid gray; font-family: fixedsys;" cellpadding=20px cellspacing=0 align=lefth width=0%
+
{| style="border:1px dashed rgb(0,0,255); background:#F3F3F3; vertical-align:top; color:#000; -moz-border-radius:2px; -webkit-border-radius: 2px; border-radius: 2px" cellpadding=20px cellspacing=0 align=lefth width=0%
 
|
 
|
 
<source lang="c">
 
<source lang="c">
Línea 66: Línea 173:
  
  
−
Además de estas posibilidades es posible utilizar el comando "[[http://www.mediawiki.org/wiki/Extension:SyntaxHighlight_GeSHi syntaxhighlight]]" y la directiva "lang", sin embargo es necesario tener intalado el módulo, para lo cual se puede seguir esta [[http://www.mediawiki.org/wiki/Extension:SyntaxHighlight_GeSHi#Installation guía]]
+
 
 +
''Nota:
 +
Para utilizar "[[http://www.mediawiki.org/wiki/Extension:SyntaxHighlight_GeSHi syntaxhighlight]]" es necesario tener instalado el módulo, para lo cual se puede seguir esta [[http://www.mediawiki.org/wiki/Extension:SyntaxHighlight_GeSHi#Installation guía]]''
 +
 
 +
 
 +
 
 +
====Referencias====
 +
[[http://en.wikibooks.org/wiki/MediaWiki_User_Guide http://www.mediawiki.org/wiki/Extension:SyntaxHighlight_GeSHi]]
 +
 
 +
[[http://en.wikibooks.org/wiki/MediaWiki_User_Guide http://en.wikibooks.org/wiki/MediaWiki_User_Guide]]
 +
 
 +
 
 +
 
 +
[[Categoría:Normas de estilo]]

Revisión actual del 14:22 1 dic 2012

Para enmarcar código, es posible utilizar los comandos "pre", "source" y "syntaxhighlight", sin embargo, pre, ofrece menos prestaciones para el código que source, y a su vez, syntaxhighlight es mas moderno que source. El comando "pre" muestra el contenido sin formato, en cambio, con "source" y "syntaxhighlight", junto con la directiva "lang", se puede elegir entre diversos lenguajes de programación para que el texto se muestre resaltado como debe ser.


En esta wiki syntaxhighlight será preferido para código. Ejemplo "pre" 


<pre>
//yo soy código en C
int hornear(int potato)
{
if(potato<10) potato++;
return(potato)
}

Producirá 

//yo soy código en C
int hornear(int potato)
{
if(potato<10) potato++;
return(potato)
}

Ejemplo "source" 


<source lang="c">
//yo soy código en C
int hornear(int potato)
{
if(potato<10) potato++;
return(potato)
}
</source>

Producirá 

//yo soy código en C
int hornear(int potato)
{
if(potato<10) potato++;
return(potato)
}

Ejemplo "syntaxhighlight" 

<syntaxhighlight lang="c">
//yo soy código en C
int hornear(int potato)
{
if(potato<10) potato++;
return(potato)
}
</syntaxhighlight>

Producirá 

//yo soy código en C
int hornear(int potato)
{
if(potato<10) potato++;
return(potato)
}

También se puede usar codigo CSS para sombrear o enmarcar contenido.

Ejemplo 1: 

{| style="background:rgb(230,230,230);color:black; solid gray; font-family: fixedsys; border-style:solid; border-width:5px;" cellpadding=20px cellspacing=0 align=lefth width=0%
|
<source lang="c">
//yo soy código en C
int hornear(int potato)
{
if(potato<10) potato++;
return(potato)
}
|}

</source>

Producirá 

//yo soy código en C
int hornear(int potato)
{
if(potato<10) potato++;
return(potato)
}

Ejemplo 2: 

{| style="background:rgb(230,230,230);color:black; solid gray; font-family: fixedsys; " cellpadding=20px cellspacing=0 align=lefth width=0%
|
<source lang="c">
//yo soy código en C
int hornear(int potato)
{
if(potato<10) potato++;
return(potato)
}
|}
</source>

Producirá 

//yo soy código en C
int hornear(int potato)
{
if(potato<10) potato++;
return(potato)
}

Ejemplo 3: 

{| style="border:1px solid #000; background:#F3F3F3; vertical-align:top; color:#000; -moz-border-radius:2px; -webkit-border-radius: 2px; border-radius: 2px" cellpadding=20px cellspacing=0 align=lefth width=0%
|
<source lang="c">
//yo soy código en C
int hornear(int potato)
{
if(potato<10) potato++;
return(potato)
}
</source>
|}

Producirá 

//yo soy código en C
int hornear(int potato)
{
if(potato<10) potato++;
return(potato)
}



Nota: Para utilizar "[syntaxhighlight]" es necesario tener instalado el módulo, para lo cual se puede seguir esta [guía]


Referencias

[http://www.mediawiki.org/wiki/Extension:SyntaxHighlight_GeSHi]

[http://en.wikibooks.org/wiki/MediaWiki_User_Guide]

Contributors

AK, Racuna

Obtenido de «http://wikitronica.labc.usb.ve/index.php?title=Enmarcado_de_código&oldid=2644»