<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Bufa Webmaster &#187; columnas</title>
	<atom:link href="http://www.bufa.es/tag/columnas/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.bufa.es</link>
	<description>Recursos web en español</description>
	<lastBuildDate>Thu, 09 Sep 2010 14:28:55 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.0.1</generator>
		<item>
		<title>Cadena de texto en varias columnas</title>
		<link>http://www.bufa.es/cadena-texto-varias-columnas/</link>
		<comments>http://www.bufa.es/cadena-texto-varias-columnas/#comments</comments>
		<pubDate>Sun, 07 Feb 2010 16:26:38 +0000</pubDate>
		<dc:creator>bufa</dc:creator>
				<category><![CDATA[Funciones]]></category>
		<category><![CDATA[PHP]]></category>
		<category><![CDATA[cadenas]]></category>
		<category><![CDATA[columnas]]></category>

		<guid isPermaLink="false">http://www.bufa.es/?p=258</guid>
		<description><![CDATA[Hace poco, he tenido que utilizar esta función para poder dividir en 2 columnas una determinada cadena de texto. Con la siguiente función php podemos también pasarle como parámetro el número de columnas que queremos. Para representar las columnas utilizaremos ...]]></description>
			<content:encoded><![CDATA[<p>Hace poco, he tenido que utilizar esta función para poder <strong>dividir en 2 columnas</strong> una determinada cadena de texto. Con la siguiente función php podemos también pasarle como parámetro el número de columnas que queremos.</p>
<p>Para representar las columnas utilizaremos css y una lista ul que será la que generemos de la cadena original.</p>

<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
</pre></td><td class="code"><pre class="php" style="font-family:monospace;"><span style="color: #000088;">$cadena</span> <span style="color: #339933;">=</span><span style="color: #0000ff;">'Sin León no hubiera España, que antes que Castilla leyes, Concilios, fueros y reyes, dieron prestigio a León. La fama cantó su hazaña con clarines de victoria: ¡León escribió la historia de Covadonga a Colón! Con su sangre a torrentes vertida dio a la Patria preciado blasón y en sus labios cobró vida el hermoso lenguaje español ¡Viva León! Tierra hidalga, tierra mía: estrofas del romancero, desde Guzmán a don Suero, va tremolando el honor. Con su sangre a torrentes vertida dio a la Patria preciado blasón y en sus labios cobró vida el hermoso lenguaje español. De piedra una plegaria la catedral semeja, sobria y gentil refleja el alma de León. De historia milenaria, de santidad osario, del arte relicario y de la fe expresión. Tierra hidalga, tierra mía: estrofas del romancero, desde Guzmán a don Suero, va tremolando el honor. Con su sangre a torrentes vertida dio a la Patria preciado blasón y en sus labios cobró vida el hermoso lenguaje español. Gloria a ti, pueblo sin par; a mi labio el corazón se asoma para gritar: ¡Viva León! ¡Viva León!'</span><span style="color: #339933;">;</span>
&nbsp;
<span style="color: #000000; font-weight: bold;">function</span> cadena_columnas <span style="color: #009900;">&#40;</span><span style="color: #000088;">$cadena</span><span style="color: #339933;">,</span> <span style="color: #000088;">$columnas</span><span style="color: #009900;">&#41;</span> <span style="color: #009900;">&#123;</span>
  <span style="color: #000088;">$salida</span> <span style="color: #339933;">=</span>  <span style="color: #0000ff;">'&lt;ul class=&quot;columnas&quot;&gt;'</span><span style="color: #339933;">;</span>
  <span style="color: #000088;">$cuerpotexto</span> <span style="color: #339933;">=</span> <span style="color: #990000;">array</span><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">&quot;<span style="color: #006699; font-weight: bold;">$cadena</span>&quot;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span> <span style="color: #666666; font-style: italic;">// generamos una matriz de la cadena</span>
  <span style="color: #000088;">$texto</span> <span style="color: #339933;">=</span> <span style="color: #990000;">implode</span><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">&quot;,&quot;</span><span style="color: #339933;">,</span> <span style="color: #000088;">$cuerpotexto</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span> <span style="color: #666666; font-style: italic;">// obtenemos cadena que contiene una representación de todos los elementos de la matriz en el mismo orden</span>
  <span style="color: #000088;">$longitud</span> <span style="color: #339933;">=</span> <span style="color: #990000;">strlen</span><span style="color: #009900;">&#40;</span><span style="color: #000088;">$texto</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span> <span style="color: #666666; font-style: italic;">// determinamos la longitud de la cadena</span>
  <span style="color: #000088;">$longitud</span> <span style="color: #339933;">=</span> <span style="color: #990000;">ceil</span><span style="color: #009900;">&#40;</span><span style="color: #000088;">$longitud</span><span style="color: #339933;">/</span><span style="color: #000088;">$columnas</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span> <span style="color: #666666; font-style: italic;">// redondeamos la longitud hacia arriba devolviendo el entero más cercano dividiendola entre el nº de columnas</span>
  <span style="color: #000088;">$palabras</span> <span style="color: #339933;">=</span> <span style="color: #990000;">explode</span><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">&quot; &quot;</span><span style="color: #339933;">,</span> <span style="color: #000088;">$texto</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span> <span style="color: #666666; font-style: italic;">// buscamos las palabras sueltas separadas por espacios</span>
  <span style="color: #000088;">$c</span> <span style="color: #339933;">=</span> <span style="color: #990000;">count</span><span style="color: #009900;">&#40;</span><span style="color: #000088;">$palabras</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span> <span style="color: #666666; font-style: italic;">// contamos el número de palabras</span>
  <span style="color: #000088;">$l</span> <span style="color: #339933;">=</span> <span style="color: #cc66cc;">0</span><span style="color: #339933;">;</span>
  <span style="color: #b1b100;">for</span><span style="color: #009900;">&#40;</span><span style="color: #000088;">$i</span><span style="color: #339933;">=</span><span style="color: #cc66cc;">1</span><span style="color: #339933;">;</span><span style="color: #000088;">$i</span><span style="color: #339933;">&lt;=</span><span style="color: #000088;">$columnas</span><span style="color: #339933;">;</span><span style="color: #000088;">$i</span><span style="color: #339933;">++</span><span style="color: #009900;">&#41;</span> <span style="color: #009900;">&#123;</span>
    <span style="color: #000088;">$nuevacadena</span> <span style="color: #339933;">=</span> <span style="color: #0000ff;">&quot;&quot;</span><span style="color: #339933;">;</span>
    <span style="color: #000088;">$salida</span> <span style="color: #339933;">.=</span> <span style="color: #0000ff;">'&lt;li&gt;'</span><span style="color: #339933;">;</span>
  <span style="color: #b1b100;">for</span><span style="color: #009900;">&#40;</span><span style="color: #000088;">$g</span><span style="color: #339933;">=</span><span style="color: #000088;">$l</span><span style="color: #339933;">;</span><span style="color: #000088;">$g</span><span style="color: #339933;">&lt;=</span><span style="color: #000088;">$c</span><span style="color: #339933;">;</span><span style="color: #000088;">$g</span><span style="color: #339933;">++</span><span style="color: #009900;">&#41;</span> <span style="color: #009900;">&#123;</span>
    <span style="color: #b1b100;">if</span><span style="color: #009900;">&#40;</span><span style="color: #990000;">strlen</span><span style="color: #009900;">&#40;</span><span style="color: #000088;">$nuevacadena</span><span style="color: #009900;">&#41;</span> <span style="color: #339933;">&lt;=</span> <span style="color: #000088;">$longitud</span> <span style="color: #339933;">||</span> <span style="color: #000088;">$i</span> <span style="color: #339933;">==</span> <span style="color: #000088;">$columnas</span><span style="color: #009900;">&#41;</span>
    <span style="color: #000088;">$nuevacadena</span><span style="color: #339933;">.=</span><span style="color: #000088;">$palabras</span><span style="color: #009900;">&#91;</span><span style="color: #000088;">$g</span><span style="color: #009900;">&#93;</span><span style="color: #339933;">.</span><span style="color: #0000ff;">&quot; &quot;</span><span style="color: #339933;">;</span>
    <span style="color: #b1b100;">else</span> <span style="color: #009900;">&#123;</span>
      <span style="color: #000088;">$l</span> <span style="color: #339933;">=</span> <span style="color: #000088;">$g</span><span style="color: #339933;">;</span>
    <span style="color: #b1b100;">break</span><span style="color: #339933;">;</span>
      <span style="color: #009900;">&#125;</span>
     <span style="color: #009900;">&#125;</span>
    <span style="color: #000088;">$salida</span> <span style="color: #339933;">.=</span> <span style="color: #000088;">$nuevacadena</span><span style="color: #339933;">;</span>
    <span style="color: #000088;">$salida</span> <span style="color: #339933;">.=</span> <span style="color: #0000ff;">'&lt;/li&gt;'</span><span style="color: #339933;">;</span>
  <span style="color: #009900;">&#125;</span>
  <span style="color: #000088;">$salida</span> <span style="color: #339933;">.=</span> <span style="color: #0000ff;">'&lt;/ul&gt;'</span><span style="color: #339933;">;</span> 
  <span style="color: #b1b100;">return</span> <span style="color: #000088;">$salida</span><span style="color: #339933;">;</span>
<span style="color: #009900;">&#125;</span>
<span style="color: #666666; font-style: italic;">// Modo de empleo: (por ejemplo para dividir el texto en 3 li o columnas)</span>
<span style="color: #b1b100;">echo</span> cadena_columnas<span style="color: #009900;">&#40;</span><span style="color: #000088;">$cadena</span><span style="color: #339933;">,</span><span style="color: #cc66cc;">3</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span></pre></td></tr></table></div>

<p>Por último ya solo falta darle un estilo en nuestro archivo css de estilos:</p>

<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>1
2
3
4
5
6
7
8
9
10
11
12
13
</pre></td><td class="code"><pre class="css" style="font-family:monospace;">.columnas<span style="color: #00AA00;">&#123;</span>
	<span style="color: #000000; font-weight: bold;">list-style</span><span style="color: #00AA00;">:</span><span style="color: #993333;">none</span><span style="color: #00AA00;">;</span>
	<span style="color: #000000; font-weight: bold;">font-family</span><span style="color: #3333ff;">:Arial</span><span style="color: #00AA00;">,</span> Helvetica<span style="color: #00AA00;">,</span> <span style="color: #993333;">sans-serif</span><span style="color: #00AA00;">;</span>
	<span style="color: #000000; font-weight: bold;">font-size</span><span style="color: #00AA00;">:</span><span style="color: #933;">12px</span><span style="color: #00AA00;">;</span>
	<span style="color: #000000; font-weight: bold;">color</span><span style="color: #00AA00;">:</span><span style="color: #cc66cc;">333</span><span style="color: #00AA00;">;</span>
<span style="color: #00AA00;">&#125;</span>
<span style="color: #6666ff;">.columnas</span> li<span style="color: #00AA00;">&#123;</span>
	<span style="color: #000000; font-weight: bold;">float</span><span style="color: #00AA00;">:</span><span style="color: #000000; font-weight: bold;">left</span><span style="color: #00AA00;">;</span>
	<span style="color: #000000; font-weight: bold;">width</span><span style="color: #00AA00;">:</span><span style="color: #933;"><span style="color: #cc66cc;">25</span>%</span><span style="color: #00AA00;">;</span>
	<span style="color: #000000; font-weight: bold;">margin</span><span style="color: #00AA00;">:</span><span style="color: #cc66cc;">0</span> <span style="color: #cc66cc;">0</span>  <span style="color: #933;">20px</span> <span style="color: #933;">20px</span><span style="color: #00AA00;">;</span>
	<span style="color: #000000; font-weight: bold;">padding</span><span style="color: #00AA00;">:</span><span style="color: #933;">15px</span><span style="color: #00AA00;">;</span>
	<span style="color: #000000; font-weight: bold;">border</span><span style="color: #00AA00;">:</span><span style="color: #933;">1px</span> <span style="color: #993333;">solid</span> <span style="color: #cc00cc;">#ccc</span><span style="color: #00AA00;">;</span>
<span style="color: #00AA00;">&#125;</span></pre></td></tr></table></div>

]]></content:encoded>
			<wfw:commentRss>http://www.bufa.es/cadena-texto-varias-columnas/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
	</channel>
</rss>
