Foros del Web » Programación web » PHP »

Poner Letras en Vertical a 90 grados

Estas en el tema de Poner Letras en Vertical a 90 grados en el foro de PHP en Foros del Web. Hola, Tengo una tabla de resultados con varias Columnas, me gustaria saber si se puede poner el contenido de las cabeceras en vertical (90 grados) ...
  #1 (permalink)  
Antiguo 26/10/2007, 01:27
 
Fecha de Ingreso: enero-2005
Ubicación: Barcelona
Mensajes: 1.473
Antigüedad: 9 años, 3 meses
Puntos: 10
Poner Letras en Vertical a 90 grados

Hola,

Tengo una tabla de resultados con varias Columnas, me gustaria saber si se puede poner el contenido de las cabeceras en vertical (90 grados) para q no ocupe tanto espacio? lo quiero hacer asi porque el contenido de las tabla son registros numericos q ocupan poquito pero la cabecera es mucho mas ancha y la tabla se expande demasiado....

es posible?????

PD: El contenido de las Cabeceras las Obtengo de una Base de Datos de MySql, sino ya lo hubiera hecho de alguna otra manera....


Salduso
__________________
"Cada hombre es el hijo de su propio trabajo"
Miguel de Cervantes Saavedra
"La experiencia es algo que no consigues hasta justo depués de necesitarla"
Laurence Olivier

Última edición por sergi_climent; 26/10/2007 a las 02:40
  #2 (permalink)  
Antiguo 26/10/2007, 03:09
 
Fecha de Ingreso: enero-2005
Ubicación: Barcelona
Mensajes: 1.473
Antigüedad: 9 años, 3 meses
Puntos: 10
Re: Poner Letras en Vertical a 90 grados

Encontre esto: http://www.forosdelweb.com/f53/rotar-texto-389434/

pero no ser como adaptarlo para q me muestre los titulos de diferentes columnas en vertical.

Código HTML:
<table>
<tr>
<td>titulo1</td><td>titulo2</td>td>...</td><td>tituloN</td>
</tr>
...
</table> 
Saludos de nuevo y gracias de antemano
__________________
"Cada hombre es el hijo de su propio trabajo"
Miguel de Cervantes Saavedra
"La experiencia es algo que no consigues hasta justo depués de necesitarla"
Laurence Olivier

Última edición por sergi_climent; 26/10/2007 a las 05:09
  #3 (permalink)  
Antiguo 26/10/2007, 09:22
 
Fecha de Ingreso: enero-2005
Ubicación: Barcelona
Mensajes: 1.473
Antigüedad: 9 años, 3 meses
Puntos: 10
Re: Poner Letras en Vertical a 90 grados

Para IE, hay la posibilidad de hacerlo con una simple linia, pero en los demas navegadores como q no funciona...
Código:
	
textoverital{writing-mode: tb-rl;filter: flipv fliph;}
alguna ayudita q me saque del apuro?

Aunque sea poner:
T
I
T
U
L
O
1

saludos
__________________
"Cada hombre es el hijo de su propio trabajo"
Miguel de Cervantes Saavedra
"La experiencia es algo que no consigues hasta justo depués de necesitarla"
Laurence Olivier

Última edición por sergi_climent; 26/10/2007 a las 09:44
  #4 (permalink)  
Antiguo 28/10/2007, 12:35
Avatar de Escoffie  
Fecha de Ingreso: abril-2003
Ubicación: Mérida, Yucatán
Mensajes: 242
Antigüedad: 11 años
Puntos: 9
Re: Poner Letras en Vertical a 90 grados

Hola sergi_climent

¿Qué usas para armar tu página? Si es PHP, y mueves tu pregunta para ese foro, puedo ayudarte con lo de:
T
I
T
U
L
O

Saludos, y espero tu respuesta.
  #5 (permalink)  
Antiguo 29/10/2007, 01:38
 
Fecha de Ingreso: enero-2005
Ubicación: Barcelona
Mensajes: 1.473
Antigüedad: 9 años, 3 meses
Puntos: 10
Re: Poner Letras en Vertical a 90 grados

Hola Escoffie,
si uso PHP para armar mi pagina, y el codigo q uso para crear la primera fila de titulos es el siguiente:
Código PHP:
<?PHP
$str_seccion  
"SELECT id_seccio, nom_seccio FROM seccio WHERE hores=1 ORDER BY nom_seccio";
$sql_seccion  mysql_query($str_seccion) or die("Error SQL Cabecera Secciones: ".mysql_error());
$nreg_seccion mysql_num_rows($sql_seccion);
if(
$nreg_seccion!=0){
  while(
$res_seccion mysql_fetch_row($sql_seccion)){
  
?>
  <td width="1%"><?=htmlentities($res_seccion[1]);?></td>    
 <?PHP
  
}    
}
PD: hacer una funcion separando la palabra y encadenar una letra con un <br> no me parece la solucion adecuada, ya q eso afecta al diseño, y no queda demasiado bien


Saludos
__________________
"Cada hombre es el hijo de su propio trabajo"
Miguel de Cervantes Saavedra
"La experiencia es algo que no consigues hasta justo depués de necesitarla"
Laurence Olivier

Última edición por sergi_climent; 30/10/2007 a las 01:27
  #6 (permalink)  
Antiguo 29/10/2007, 12:01
Avatar de Escoffie  
Fecha de Ingreso: abril-2003
Ubicación: Mérida, Yucatán
Mensajes: 242
Antigüedad: 11 años
Puntos: 9
Re: Poner Letras en Vertical a 90 grados

Hola sergi_climent:

Para tenerlos como:
T
Í
T
U
L
O

... puedes hacer esto:

Código PHP:
<?php
$cadena
=utf8_encode("Mi Titulo");
echo 
$cadena[0]."<br/>";
echo 
$cadena[1]."<br/>";
echo 
$cadena[2]."<br/>";
echo 
$cadena[3]."<br/>";
echo 
$cadena[4]."<br/>";
echo 
$cadena[5]."<br/>";
?>
  #7 (permalink)  
Antiguo 30/10/2007, 01:32
 
Fecha de Ingreso: enero-2005
Ubicación: Barcelona
Mensajes: 1.473
Antigüedad: 9 años, 3 meses
Puntos: 10
Re: Poner Letras en Vertical a 90 grados

Hola de nuevo y gracias por tu respuesta!

si pongo BR, quedan las letras con una separacion demasiado grande... y eso afecta al diseño, ya q hay un titulo q supera los 14 caracteres...

hay alguna otra manera de poder hacerlo?

la opcion q he encontrado y mas me ha gustado es la siguiente, pero no ser como adaptarla a mis necesidades!
Código HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
<html>
<head>
<title>BTLR.</title>
<script type="text/javascript">
function btlr(){
var contFin = "";
var objIni = document.getElementById( "derecho" );
var objFin = document.getElementById( "torcido" );
var alcho = parseInt(objIni.offsetHeight);
var anto = parseInt(objIni.offsetWidth);
var contIni = objIni.innerHTML;
var i , j;
objFin.style.height = anto +"px";
objFin.style.width = alcho +"px";

for(i=0; i<alcho; i++){
for(j=0; j<anto; j++){
contFin += "<div style='position:absolute; top:"+(anto-j-1)+"px; left:"+i+"px; background-color:#ffffff; height:1px; width:1px; overflow:hidden'><div style='white-space:nowrap; cursor:not-allowed; margin-left:"+ (j*-1) +"px; margin-top:"+(i*-1)+"px; background-color:#ffffff; overflow:hidden;'>"+ contIni +"</div></div>"}}

objFin.innerHTML = contFin;
}
//onload = btlr;
</script>
<style type="text/css">
body{color:#ffffff; background-color:#000000; }
#derecho , #torcido {position:relative; font: bold 16px sans-serif;postion:relative; border-collapse:collapse; color:#000000; background-color:#ffffff; overflow:hidden;}
</style>
</head>
<body>
<h2>Simulaci&oacute;n de texto rotado a 270°. ( IE 5.5+, FF )</h2>

<p><span id="derecho">Foros del Web</span></p>

<div id="torcido"> <input type="button" value="270°" onclick="btlr(); return false"> Clic para rotar. ( El efecto puede demorar varios segundos en mostrarse. )</div>

</body>
</html> 
Link : http://www.forosdelweb.com/f53/rotar...4/#post2027009

Muchas Gracias de antemano,

Saludos
__________________
"Cada hombre es el hijo de su propio trabajo"
Miguel de Cervantes Saavedra
"La experiencia es algo que no consigues hasta justo depués de necesitarla"
Laurence Olivier
  #8 (permalink)  
Antiguo 06/11/2007, 03:48
 
Fecha de Ingreso: enero-2005
Ubicación: Barcelona
Mensajes: 1.473
Antigüedad: 9 años, 3 meses
Puntos: 10
Re: Poner Letras en Vertical a 90 grados

Hola de nuevo, alguien podria ayudarme a adaptar este codigo para q una cabezera dinamica de una tabla se mostrara en vertical?

es decir, trabajo en PHP y Mysql. Y para mostrar la cabecera de una tabla uso una tabla de Mysql con los Registros q tiene, lo quiero poner en vertical xq asi me ocupara menos espacio... a ver si me podeis hechar una mano...
el codigo q uso para la cabecera es el siguiente
Código PHP:
<?
    $str_seccio  
"SELECT id_seccio, nom_seccio FROM seccio WHERE hores=1 ORDER BY nom_seccio";
    
$sql_seccio  mysql_query($str_seccio) or die("Error SQL Cabecera Secciones: ".mysql_error());
    
$nreg_seccio mysql_num_rows($sql_seccio);
    if(
$nreg_seccio!=0){
        while(
$res_seccio mysql_fetch_row($sql_seccio)){
        
?>
        <td class="capceleravertical" height="20px"><?=htmlentities($res_seccio[1]);?></td>    
        <?
        
}    
    }
    
?>
muchas gracias

Saludos
__________________
"Cada hombre es el hijo de su propio trabajo"
Miguel de Cervantes Saavedra
"La experiencia es algo que no consigues hasta justo depués de necesitarla"
Laurence Olivier
  #9 (permalink)  
Antiguo 22/11/2007, 01:44
 
Fecha de Ingreso: enero-2005
Ubicación: Barcelona
Mensajes: 1.473
Antigüedad: 9 años, 3 meses
Puntos: 10
Re: Poner Letras en Vertical a 90 grados

Hola de nuevo, sigo con el mismo dilema??? alguien me puede hechar una mano? o las dos?

Saludos y gracias de antemano
__________________
"Cada hombre es el hijo de su propio trabajo"
Miguel de Cervantes Saavedra
"La experiencia es algo que no consigues hasta justo depués de necesitarla"
Laurence Olivier
  #10 (permalink)  
Antiguo 24/11/2007, 06:59
 
Fecha de Ingreso: noviembre-2007
Mensajes: 7
Antigüedad: 6 años, 5 meses
Puntos: 0
Re: Poner Letras en Vertical a 90 grados

Lo que se me ocurre en estos momentos (aunque lo veo una solucion nada estetica)
mira lo que puedes hacer es desmembrar cada titulo osea a cada palabra dividirla por letras y hacer algo asi


<td >
<p>C</p>
<p>a</p>
<p>b</p>
<p>e</p>
<p>c</p>
<p>e</p>
<p>r</p>
<p>a</p>
</td>

claro esto en php por cada letras que sacas y muestras le pones un <p>$letra[$i]</p>,
y en css creas un estilo para parrafo
p {line-height:0.3em;} por ejemplo, bueno es algo que se me ocurrio.........quizas funcione o quizas no, de todas maneras haber si lo pruebo y te comento..............
  #11 (permalink)  
Antiguo 24/11/2007, 07:39
 
Fecha de Ingreso: noviembre-2007
Mensajes: 7
Antigüedad: 6 años, 5 meses
Puntos: 0
Re: Poner Letras en Vertical a 90 grados

Bueno lo que me salio en vertical es lo siguiente:

<?php
$variable="Cabecera";
$variable_len=strlen($variable);
echo "<td>";
for($i=0;$i<=$variable_len;$i++)
{
echo "<p>".substr($variable, $i,1)."</p>";
}
echo "</td>";
?>

y como te dije anteriormente para que no tengas separaciones largas en css usa
p {
line-height:0.3em;
}
o juega con eso, y en variable puedes asignarle tu resultado de la bd $res_seccion[1]
  #12 (permalink)  
Antiguo 24/11/2007, 11:07
Avatar de AlZuwaga
Moderador
 
Fecha de Ingreso: febrero-2001
Ubicación: 34.517 S, 58.500 O
Mensajes: 14.554
Antigüedad: 13 años, 2 meses
Puntos: 534
Re: Poner Letras en Vertical a 90 grados

Ya que usas php... por qué no hacés uso de GD para crear una imagen con los textos en cuestión y rotarlas 90º dinámicamente?
__________________
...___...
  #13 (permalink)  
Antiguo 26/11/2007, 00:41
 
Fecha de Ingreso: enero-2005
Ubicación: Barcelona
Mensajes: 1.473
Antigüedad: 9 años, 3 meses
Puntos: 10
Re: Poner Letras en Vertical a 90 grados

Hola a todos y gracias por contestar...

Cita:
Iniciado por Al Zuwaga Ver Mensaje
Ya que usas php... por qué no hacés uso de GD para crear una imagen con los textos en cuestión y rotarlas 90º dinámicamente?
me parece la opcion mas factible lo unico q no tengo mucho por mano esta libreria, a ver si alguien me podria hechar una manita de como puedo transformar un texto en imagen...

Gracias de antemano,

Saludos
__________________
"Cada hombre es el hijo de su propio trabajo"
Miguel de Cervantes Saavedra
"La experiencia es algo que no consigues hasta justo depués de necesitarla"
Laurence Olivier
  #14 (permalink)  
Antiguo 26/11/2007, 04:01
 
Fecha de Ingreso: enero-2005
Ubicación: Barcelona
Mensajes: 1.473
Antigüedad: 9 años, 3 meses
Puntos: 10
Re: Poner Letras en Vertical a 90 grados

consegui hacer eso en PHP
aqui dejo el codigo por si alguien se sirve
Código PHP:
<?php 
header
("Content-type: image/gif"); 
//imagecreatefromgif -- Crear una nova imatge a partir de un arxiu o URL
//http://es.php.net/manual/es/function.imagecreatefromgif.php
$img1 imagecreatefromgif("home.gif"); 
//Tipus de Letra
$fuente "daniela.ttf"
//imagecolorallocate -- Reserva un color per una imatge
//http://es.php.net/manual/es/function.imagecolorallocate.php
$color imagecolorallocate($img1,255,255,255); 
//Texte q convertirem amb Imatge
$paraula "Manteniment fresc";
//imagettftext -- Escriu un texte sobre la imatge utilitzan les fonts TrueType
//http://es.php.net/manual/es/function.imagettftext.php
imagettftext($img1,13,90,15,80,$color,$fuente$paraula); 
//imagegif -- Produir la sortida d'una imatge al navegador o a un arxiu
//http://es.php.net/manual/es/function.imagegif.php
imagegif($img1); 
//imagedestroy -- Destrueix una imatge
//http://es.php.net/manual/es/function.imagedestroy.php
imagedestroy($img1); 
?>
__________________
"Cada hombre es el hijo de su propio trabajo"
Miguel de Cervantes Saavedra
"La experiencia es algo que no consigues hasta justo depués de necesitarla"
Laurence Olivier
  #15 (permalink)  
Antiguo 26/11/2007, 08:39
Avatar de JavierB
Moderata
 
Fecha de Ingreso: febrero-2002
Ubicación: Madrid
Mensajes: 25.055
Antigüedad: 12 años, 2 meses
Puntos: 764
Re: Poner Letras en Vertical a 90 grados

Creo que este mensaje será más útil en el foro de PHP.

Movido desde Css.

Saludos,
  #16 (permalink)  
Antiguo 26/11/2007, 09:12
 
Fecha de Ingreso: enero-2005
Ubicación: Barcelona
Mensajes: 1.473
Antigüedad: 9 años, 3 meses
Puntos: 10
Re: Poner Letras en Vertical a 90 grados

Antes de q movieran el Post, hice la continuacion en PHP donde se han solucionado un par de cosas pero aun me keda alguna cosita mas q solventar.
aqui dejo el LINK:
http://www.forosdelweb.com/f18/ph-p-...-linea-536018/
__________________
"Cada hombre es el hijo de su propio trabajo"
Miguel de Cervantes Saavedra
"La experiencia es algo que no consigues hasta justo depués de necesitarla"
Laurence Olivier
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 13:33.
SEO by vBSEO 3.3.2