Foros del Web » Creando para Internet » CSS »

Tabla

Estas en el tema de Tabla en el foro de CSS en Foros del Web. Hola estoy haciendo un webservice para una intranet. como lleva un monton de hojas .php decidi utilizar una hoja.css para marcar todo el estilo del ...
  #1 (permalink)  
Antiguo 11/09/2010, 15:04
Avatar de SirDuque  
Fecha de Ingreso: febrero-2009
Ubicación: Paso del Rey, Buenos Aires, Argentina
Mensajes: 975
Antigüedad: 8 años, 10 meses
Puntos: 89
Tabla

Hola estoy haciendo un webservice para una intranet.
como lleva un monton de hojas .php decidi utilizar una hoja.css para marcar todo el estilo del webservice y si mañana quiero cambiar un colo o demas solo toco esta hoja.css y no las 259hojas o mas.

Bueno el dreamweaver me ayuda muchisimo, entendi como es el metodo y me gustaria, hacer algo.

este web service, tiene como principal un marco echo en trabla.

y bueno la pregunta es la siguiente:

como puedo utilizar el .css para dimensionar el marco principal y las sub tablas.

me gustaria si pueden darme un mini ejemplo de 2 filas x 2 columnas. si es posible. en el faq encontre esto:

/* Modulos de Tablas
CAPTION {}
COL {}
COLGROUP {}
TABLE {}
TBODY {}
TD {}
TFOOT {}
TH {}
THEAD {}
TR {}
pero no entiendo como usarlo :(
  #2 (permalink)  
Antiguo 11/09/2010, 16:12
Avatar de cristian_cena
Colaborador
 
Fecha de Ingreso: junio-2009
Mensajes: 2.244
Antigüedad: 8 años, 5 meses
Puntos: 269
Respuesta: Tabla

Hola SirDuque:
suponiendo que tienes:
<table>
<tr><td>columna1</td><td>columna2</td></tr>
<tr><td>columna1</td><td>columna2</td></tr>
</table>

Con esto...:

table{ ...daras estilo a la caja de la tabla que contiene todas las filas y columnas ... }
table tr{... daras estilo a todas las filas ...}
table tr td{... daras estilo a todas las celdas ...}

si quieres jugar un poco más con los estilos puedes dar class e id:

<table id="tabla1">
<tr class="filas"><td class="celdas">columna1</td><td class="celdas">columna2</td></tr>
<tr class="filas"><td class="celdas" id="celdaDestacada">columna1</td><td class="celdas">columna2</td></tr>
</table>

Con esto...:
#tabla1{... daras estilo a la caja de la tabla que contiene todas las filas y columnas ...}
.filas{... daras estilo a todas las filas ...}
.celdas {... daras estilo a todas las celdas ...}
#celdaDestacada{... daras estilo solo a la caja de la celda en cuestión ...}

Espero te sirva. un saludo.
  #3 (permalink)  
Antiguo 11/09/2010, 18:04
Avatar de SirDuque  
Fecha de Ingreso: febrero-2009
Ubicación: Paso del Rey, Buenos Aires, Argentina
Mensajes: 975
Antigüedad: 8 años, 10 meses
Puntos: 89
Respuesta: Tabla

sisi gracias cristian_cena

Entonces si no entendi mal puedo hacer esto:


<table style="marco">
<tr><td>columna1</td><td>columna2</td></tr>
<tr><td>columna1</td><td>columna2</td></tr>
</table>

.marco {
height: 650px;
width: 800px;
}

y con eso manipular las dimensiones.
estoy en lo correcto?
  #4 (permalink)  
Antiguo 11/09/2010, 19:57
Avatar de Shaito  
Fecha de Ingreso: agosto-2010
Mensajes: 383
Antigüedad: 7 años, 4 meses
Puntos: 37
Respuesta: Tabla

Hola SirDuque!

Hay un pequeño fallo, si quieres aplicar un efecto a un div o a cualquier otro elemento, como en este caso es un table, tienes que hacerlo por medio de un Class y un Id o por medio de un style.

Si por ejemplo quieres aplicar un estilo de una hoja común como dices, tienes que usar Class o ID, estos hacen referencia a la hoja.
Para hacer referencia con un Class tienes que poner
<table class="ejemplo">
A lo que en el Css tienes que poner
.ejemplo
Y si por el contrario lo quieres por medio de un Id tienes que poner
<table id="ejemplo">
Y en el Css
#ejemplo

Eso es para cuando aplicas el estilo de una forma común. El metodo que tu usaste, style sirve para aplicar un estilo únicamente al objeto en cuestión, es decir:
<table style"background-color:black; color:white">
De este modo obtenemos una table con el fondo negro y el texto en color blanco.
Pero este estilo únicamente se agregará a esta table.
Esta es una buena forma de dar un efecto o un último ajuste a un objeto.

A lo que quiero llegar es a lo siguiente, en tu code pusiste:

<table style="marco"> // Si hace referencia a un .css has de aplicar Class o Id, si por el contrario es un estilo único para esta table (tendrías que ponerlo así en todas no como en el .css que es una regla para todas)
<tr><td>columna1</td><td>columna2</td></tr>
<tr><td>columna1</td><td>columna2</td></tr>
</table>

.marco { // Aquí estas indicando por el " . " que el metodo que vas a usar para hacer referencia a .marco es un Class, si lo quisieses hacer con un Id tendrías que poner #marco
height: 650px;
width: 800px;
}

Espero que te haya sido de ayuda!

Saludos
  #5 (permalink)  
Antiguo 11/09/2010, 20:13
Avatar de SirDuque  
Fecha de Ingreso: febrero-2009
Ubicación: Paso del Rey, Buenos Aires, Argentina
Mensajes: 975
Antigüedad: 8 años, 10 meses
Puntos: 89
Respuesta: Tabla

Gracias Shaito era lo que queria hacer :D
  #6 (permalink)  
Antiguo 11/09/2010, 20:30
Avatar de cristian_cena
Colaborador
 
Fecha de Ingreso: junio-2009
Mensajes: 2.244
Antigüedad: 8 años, 5 meses
Puntos: 269
Respuesta: Tabla

a modo de agregar mi granito de arena:

esto ...
<etiqueta style="propiedadcss:valor; otrapropiedad:valor;"></etiqueta>
... tiene mas contras que pros digamos ya que va en contra del fin primero de las hojas de estilo el cual consiste en separar el contenido del diseño y con ello ahorrar valioso tiempo de mantenimiento.

Pero no quita que puedas usarlo tranquilamente.

Shaito ha explicado bien el tema. Asi que me despido con un saludo y que bueno que te sirvio.

Etiquetas: tablas
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

SíEste tema le ha gustado a 1 personas




La zona horaria es GMT -6. Ahora son las 01:14.