Foro de elhacker.net

Programación => Desarrollo Web => Mensaje iniciado por: carlosuc99 en 30 Junio 2012, 16:03 pm


Título: Una ayudita con el diseño
Publicado por: carlosuc99 en 30 Junio 2012, 16:03 pm
Buenas,

Tengo estos dos archivos:

1) aea_users.php

Código
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
  2. <html>
  3. <head>
  4. <link rel="STYLESHEET" type="text/css" href="aea_style.css">
  5. <title>Documento sin t&iacute;tulo</title>
  6. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
  7. </head>
  8.  
  9. <body>
  10. <?php
  11. include('db_login.php');
  12. $connection = mysql_connect($db_host, $db_username, $db_password);
  13. if (!$connection){
  14. die ("No se puede conectar con la base de datos: <br />". mysql_error());
  15. }
  16.  
  17.  
  18. $db_select = mysql_select_db($db_database);
  19. if (!$db_select){
  20. die ("No se puede seleccionar la base de datos: <br />". mysql_error());
  21. }
  22.  
  23. $query = "SELECT *  FROM `aea_users` where username='' ";
  24.  
  25. $result = mysql_query( $query );
  26. if (!$result)
  27. {
  28. die ("No se puede hacer la consulta en la base de datos: <br />". mysql_error());
  29. }
  30.  
  31. ?>
  32. <P>
  33. <H3 align="center">Pilotos sin Callsign </H3>
  34.  
  35. <?php
  36.  
  37.  
  38. echo '<table border="0">';
  39. echo "<tr><th class=helpHed>Callsign</th><th class=helpHed>Nombre</th><th class=helpHed>Base</th><th class=helpHed>ID VATSIM</th><th class=helpHed>Gestionar</th></tr>";
  40. while ($row = mysql_fetch_array($result, MYSQL_ASSOC)){
  41.  
  42. ?>
  43.  
  44. <tr onmouseover="this.style.background='#F4973A';"
  45.     onmouseout="this.style.background='#FFF';">
  46.  
  47. <?php
  48. echo "<td class=helpBod3>";
  49. echo $row["username"] . '</td><td class=helpBod3>';
  50. echo $row["name"] . '</td><td class=helpBod3>';
  51.  
  52. echo $row["hub"] . '</td><td class=helpBod3>';
  53.  
  54. echo $row["vatsim_id"] . '</td><td class=helpBod3>';
  55.  
  56. echo '<a href="alta_piloto.php?piloto_id='.$row["id"].'"><IMG src="images/edit0.png" WIDTH="20" HEIGHT="20" BORDER=0 ALT=""></a></td></tr>';
  57.  
  58. }
  59. echo "</table>";
  60.  
  61. ?>
  62. </body>
  63. </html>



2) aea_style.css

Código:
table.helpT
{ text-align: center;
font-family: Verdana;
font-weight: normal;
font-size: 11px;
color: #404040;
width: 550px;
background-color: #fafafa;
border: 1px #4C84BC  solid;
border-bottom: 1px #6699CC solid;
border-collapse: collapse;
border-spacing: 1px; }

th.helpHed
{
	border-bottom: 2px solid #4C84BC;
	border-left: 0px solid #4C84BC;
	background-color: #4C84BC;
	text-align: center;
	text-indent: 5px;
	font-family: Arial;
	font-weight: bold;
	font-size: 13px;
	color: #FFFFFF;
}

th.helpHed_externo
{ border-bottom: 2px solid #D4154E;
border-left: 0px solid #6699CC;
background-color: #D4154E;
text-align: center;
text-indent: 5px;
font-family: Verdana;
font-weight: bold;
font-size: 11px;
color: #FFFFFF; }

td.helpBod
{ border-bottom: 0px dotted #9CF;
border-top: 0px;
border-left: 0px dotted #9CF;
border-right: 0px;
text-align: left;
text-indent: 10px;
font-family: Verdana, sans-serif, Arial;
font-weight: normal;
font-size: 11px;
color: #404040;
background-color: #fafafa; }

tr.helpBod
{ border-bottom: 0px dotted #9CF;
border-top: 0px;
border-left: 0px dotted #9CF;
border-right: 0px;
text-align: left;
text-indent: 10px;
font-family: Verdana, sans-serif, Arial;
font-weight: normal;
font-size: 11px;
color: #404040;
background-color: #fafafa; }

tr.helpBod:hover
{ border-bottom: 0px dotted #9CF;
border-top: 0px;
border-left: 0px dotted #9CF;
border-right: 0px;
text-align: left;
text-indent: 10px;
font-family: Verdana, sans-serif, Arial;
font-weight: normal;
font-size: 11px;
color: #404040;
background-color: #faf777; }

tr.helpBod_hover
{ border-bottom: 0px dotted #9CF;
border-top: 0px;
border-left: 0px dotted #9CF;
border-right: 0px;
text-align: left;
text-indent: 10px;
font-family: Verdana, sans-serif, Arial;
font-weight: normal;
font-size: 11px;
color: #404040;
background-color: #faf777; }


td.helpBod_izq
{ border-bottom: 0px dotted #9CF;
border-top: 0px;
border-left: 0px dotted #9CF;
border-right: 0px;
text-align: left;
text-indent: 10px;
font-family: Verdana, sans-serif, Arial;
font-weight: normal;
font-size: 11px; }

td.helpBod2
{ border-bottom: 0px dotted #9CF;
border-top: 0px;
border-left: 0px dotted #9CF;
border-right: 0px;
text-align: center;
text-indent: 10px;
font-family: Verdana, sans-serif, Arial;
font-weight: normal;
font-size: 11px;
color: #404040;
background-color: #fafafa; }

td.helpBod3
{ border-bottom: 0px dotted #9CF;
border-top: 0px;
border-left: 0px dotted #9CF;
border-right: 0px;
text-align: center;
text-indent: 10px;
font-family: Verdana, sans-serif, Arial;
font-weight: normal;
font-size: 11px; }

td.helpBod4
{ border-bottom: 0px dotted #9CF;
border-top: 0px;
border-left: 0px dotted #9CF;
border-right: 0px;
text-align: left ;
text-indent: 10px;
font-family: Verdana, sans-serif, Arial;
font-weight: normal;
font-size: 11px;

 }
td.helpBod5
{ border-bottom: 0px dotted #9CF;
border-top: 0px;
border-left: 0px dotted #9CF;
border-right: 0px;
text-align: right ;
text-indent: 10px;
font-family: Verdana, sans-serif, Arial;
font-weight: normal;
font-size: 9px;

 }

table.sofT
{ text-align: center;
font-family: Verdana;
font-weight: normal;
font-size: 11px;
color: #404040;
width: 580px;
background-color: #fafafa;
border: 1px #6699CC solid;
border-collapse: collapse;
border-spacing: 0px;

y en el archivo pilotos_mgr.php se ve lo siguiente:

(http://i48.tinypic.com/206ognk.png)

Y cada vez que paso por encioma de una fila se ve amarillo por esto:

Código:
<tr onmouseover="this.style.background='#F4973A';"
    onmouseout="this.style.background='#FFF';">

Pues lo que yo quiero es que las columnas estean juntas y no separadas por el espacio blanco como se observa en la 1era imagen y que en vez de mostrarse lo naranja quede fijo pases o no pases el raton por encima de la fila lo siguiente: filas impares de color blanco e impares de un gris.

Si algo no entendéis que sería muy normal, preguntar.

Título: Re: Una ayudita con el diseño
Publicado por: Spider-Net en 30 Junio 2012, 16:33 pm
<table border="0" cellspacing="0">

No mostrará la separación blanca entre cada celda. Lo otro que hablas de naranja o no se qué no entiendo nada, porque no veo nada naranja :S

Para poner filas de un color y otras de otro hazlo así:

Código
  1. echo "<table border='0' cellspacing='0'>";
  2. echo "<tr><th class=helpHed>Callsign</th><th class=helpHed>Nombre</th><th class=helpHed>Base</th><th class=helpHed>ID VATSIM</th><th class=helpHed>Gestionar</th></tr>";
  3.  
  4. while ($row = mysql_fetch_array($result, MYSQL_ASSOC)){
  5.    if($i++%2==0){
  6.        $color="#FFFFFF";
  7.    }else{
  8.        $color="#CCCCCC";
  9.    }
  10.  
  11. echo "<tr style='background-color: ".$color.";'>";
  12. echo "<td class=helpBod3>";
  13. echo $row["username"] . '</td><td class=helpBod3>';
  14. echo $row["name"] . '</td><td class=helpBod3>';
  15.  
  16. echo $row["hub"] . '</td><td class=helpBod3>';
  17.  
  18. echo $row["vatsim_id"] . '</td><td class=helpBod3>';
  19.  
  20. echo '<a href="alta_piloto.php?piloto_id='.$row["id"].'"><IMG src="images/edit0.png" WIDTH="20" HEIGHT="20" BORDER=0 ALT=""></a></td>';
  21. echo "</tr>";
  22.  
  23. }
  24.  
  25. echo "</table>";

Por último te aconsejo que organices mejor tu código, porque el día que tengas que modificarlo te va a costar mucho más.

El código que te he puesto lo he hecho a ojo aquí en el foro, no lo he probado, así que igual puede tener algún error, pero no creo que sea muy difícil de corregir dado el caso.

Título: Re: Una ayudita con el diseño
Publicado por: carlosuc99 en 30 Junio 2012, 17:02 pm
Cita de: Spider-Net en 30 Junio 2012, 16:33 pm
<table border="0" cellspacing="0">

No mostrará la separación blanca entre cada celda. Lo otro que hablas de naranja o no se qué no entiendo nada, porque no veo nada naranja :S

Para poner filas de un color y otras de otro hazlo así:

Código
  1. echo "<table border='0' cellspacing='0'>";
  2. echo "<tr><th class=helpHed>Callsign</th><th class=helpHed>Nombre</th><th class=helpHed>Base</th><th class=helpHed>ID VATSIM</th><th class=helpHed>Gestionar</th></tr>";
  3.  
  4. while ($row = mysql_fetch_array($result, MYSQL_ASSOC)){
  5.    if($i++%2==0){
  6.        $color="#FFFFFF";
  7.    }else{
  8.        $color="#CCCCCC";
  9.    }
  10.  
  11. echo "<tr style='background-color: ".$color.";'>";
  12. echo "<td class=helpBod3>";
  13. echo $row["username"] . '</td><td class=helpBod3>';
  14. echo $row["name"] . '</td><td class=helpBod3>';
  15.  
  16. echo $row["hub"] . '</td><td class=helpBod3>';
  17.  
  18. echo $row["vatsim_id"] . '</td><td class=helpBod3>';
  19.  
  20. echo '<a href="alta_piloto.php?piloto_id='.$row["id"].'"><IMG src="images/edit0.png" WIDTH="20" HEIGHT="20" BORDER=0 ALT=""></a></td>';
  21. echo "</tr>";
  22.  
  23. }
  24.  
  25. echo "</table>";

Por último te aconsejo que organices mejor tu código, porque el día que tengas que modificarlo te va a costar mucho más.

El código que te he puesto lo he hecho a ojo aquí en el foro, no lo he probado, así que igual puede tener algún error, pero no creo que sea muy difícil de corregir dado el caso.

Perfecto, eres un crack. MUCHAS GRACIAS!!!!!


Powered by SMF 1.1.21 | SMF © 2006-2008, Simple Machines