Foros del Web » Creando para Internet » CSS »

reducir codigo

Estas en el tema de reducir codigo en el foro de CSS en Foros del Web. saludos a todos, me interesaria saber como puedo reducir mas un codigo, aka les dejo mi codigo, a ver si se puede, gracias de antemano ...
  #1 (permalink)  
Antiguo 30/04/2009, 15:01
 
Fecha de Ingreso: noviembre-2007
Mensajes: 237
Antigüedad: 10 años, 1 mes
Puntos: 4
reducir codigo

saludos a todos, me interesaria saber como puedo reducir mas un codigo, aka les dejo mi codigo, a ver si se puede, gracias de antemano

Código PHP:
<style type="text/css">

#tabla_detalle{
width:569px;
border:solid 1px #CCCCCC;
border-collapse:collapse;
background:#FFFFFF;

}

.
superior{
background-color:#0000FF;
text-align:center;
}

.
cell1{
width:50px;
border-left:solid 2px #CCCCCC;
border-right:solid 2px #CCCCCC;
border-topsolid 2px #CCCCCC;
border-bottomsolid 2px #CCCCCC;


}


.
cell2{
border-left:solid 2px #CCCCCC;
border-right:solid 2px #CCCCCC;
border-topsolid 2px #CCCCCC;
border-bottomsolid 2px #CCCCCC;
width:400px;

}

</
style>

<
table id="tabla_detalle">

<
tr class="superior">

    <
td class="cell1">N</td>
    <
td class="cell2">Producto</td>
    <
td class="cell1">Precio uni.</td>
    <
td class="cell1">Cant.</td>
    <
td class="cell1">Total</td>
</
tr>

    <
td class="cell1">1</td>
    <
td class="cell2">Pan</td>
    <
td class="cell1">500</td>
    <
td class="cell1">1</td>
    <
td class="cell1">500</td>
<
tr>

    <
td class="cell1">2</td>
    <
td class="cell2">Bebida</td>
    <
td class="cell1">800</td>
    <
td class="cell1">2</td>
    <
td class="cell1">1600</td>
</
tr>

</
table
  #2 (permalink)  
Antiguo 30/04/2009, 15:11
Avatar de willyfc  
Fecha de Ingreso: octubre-2008
Ubicación: Santa Cruz - Bolivia
Mensajes: 662
Antigüedad: 9 años, 2 meses
Puntos: 40
Respuesta: reducir codigo

pues al css se lo podría dejar así:

Código:
<style type="text/css"> 
#tabla_detalle{ width:569px; border:solid 1px #CCCCCC; border-collapse:collapse; background-color:#FFF; } 
.superior{ background-color:#0000FF; text-align:center; } 
.cell1{ width:50px;border:2px solid #CCC;} 
.cell2{ border:2px solid #CCC;width:400px;} 
</style>
no veo más donde, mira, hay cosas en la que puedes ahorrar lineas de código como el border, si el borde es igual a los 4 lados pues es una sola línea como te coloque arriba.

también con margin y padding puedes hacer lo mismo:

Código:
.estilo{
	padding-top:10px;padding-right:30px;padding-bottom:40px;padding-left:20px;/*Así no*/
	padding:10px 30px 40px 20px;/*Así si en el mismo orden que esta arriba*/
	padding:10px;/*Si todos los lados son iguales*/
}
y lo mismo con el margin.
__________________
WFC
codigo82
  #3 (permalink)  
Antiguo 30/04/2009, 15:17
Avatar de ArturoGallegos
Moderador
 
Fecha de Ingreso: febrero-2008
Ubicación: Morelia, México
Mensajes: 5.825
Antigüedad: 9 años, 9 meses
Puntos: 952
Sonrisa Respuesta: reducir codigo

edito: willyfc perdona repeti lo mismo eso me pasa por esperar tanto en presionar guardar jajaja ni modo

agrupa estas propiedades:

Código HTML:
.cell1{
width:50px;
border-left:solid 2px #CCCCCC;
border-right:solid 2px #CCCCCC;
border-top: solid 2px #CCCCCC;
border-bottom: solid 2px #CCCCCC;


}


.cell2{
border-left:solid 2px #CCCCCC;
border-right:solid 2px #CCCCCC;
border-top: solid 2px #CCCCCC;
border-bottom: solid 2px #CCCCCC;
width:400px;

}
son repetitivas y dejas mucho espacio libre que relentiza pon algo así

Código HTML:
.cell1{width:50px;}
.cell2{width:400px;}
.cell1, .cell2{border:2px #CCCCCC solid;}
el usar un renglón para cada propiedad es solo para guiarte tu mismo pero para un explorador no importa si lo dejas todo en una sola linea o lo separas
así que te recomiendo no dejes espacios y si los dejas que sean lo menos posible
__________________
Toda ayuda se proporciona exclusivamente en el foro, no skype, no mensajes privados u otro medio....
  #4 (permalink)  
Antiguo 30/04/2009, 22:23
 
Fecha de Ingreso: noviembre-2007
Mensajes: 237
Antigüedad: 10 años, 1 mes
Puntos: 4
Respuesta: reducir codigo

gracias por las respuestas, las tomare en cuenta
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 11:07.