Foros del Web » Creando para Internet » CSS »

Quiero usar CSS para pulir un código. Alguna recomendación?

Estas en el tema de Quiero usar CSS para pulir un código. Alguna recomendación? en el foro de CSS en Foros del Web. Estoy usando Marcomedia Dreamweaver para codificar el site de mi proyecto. Este código es el de la página principal (aún no está lista pero tiene ...
  #1 (permalink)  
Antiguo 17/07/2007, 16:13
Avatar de ghosthead-nebula  
Fecha de Ingreso: marzo-2007
Mensajes: 273
Antigüedad: 10 años, 9 meses
Puntos: 3
Pregunta Quiero usar CSS para pulir un código. Alguna recomendación?

Estoy usando Marcomedia Dreamweaver para codificar el site de mi proyecto.

Este código es el de la página principal (aún no está lista pero tiene lo básico, y quizás sufra algún cambio):

Código PHP:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd"
>
<
html>
<
head>
<
title>Inscripciones por Departamento</title>
<
meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<
style type="text/css">
<!--
body {
    
background-color#CCCCCC;
}
.
style1 {
    
color#FFFFFF;
    
font-familyArialHelveticasans-serif;
    
font-size10px;
}
.
style2 {color#000066}
a:link {
    
text-decorationnone;
}
a:visited {
    
text-decorationnone;
    
color#000066;
}
a:hover {
    
text-decorationnone;
    
color#0000FF;
}
a:active {
    
text-decorationnone;
    
color#000066;
}
.
style3 {
    
font-sizexx-large;
    
font-familyVerdanaArialHelveticasans-serif;
}
.
style7 {
    
font-familyVerdanaArialHelveticasans-serif;
    
font-sizesmall;
}
.
style10 {font-sizesmall}
.
style20 {color#000066; font-family: Verdana, Arial, Helvetica, sans-serif; font-weight: bold; font-size: small; }
-->
</
style></head>

<
body>
<
div align="center">
  <
table width="1000" border="0" cellspacing="0" cellpadding="0">
    <
tr>
      <
td height="125" colspan="3"><div align="center"><img src="../Images/Banner-Sup.png" width="1000" height="125"></div></td>
    </
tr>
    <
tr>
      <
td height="89" colspan="3"><div align="center">
        <
table width="1000" height="89" border="0" cellpadding="0" cellspacing="0">
          <
tr>
            <
td width="496" height="89" background="../Images/Banner-Dwn1.PNG"><div align="left"></div></td>
            <
td width="468" background="../Images/Banner-Dwn2.PNG"><div align="center">
              <
form name="form1" method="post" action="../CGI/ident.php">
                <
div align="right">
                  <
p><span class="style1">Iniciar Sesi&oacute;n</span>
                      <
input name="ced" type="text" maxlength="8">
                    &
nbsp;&nbsp;&nbsp;
                      <
input type="submit" name="Submit" value="Aceptar">
                  </
p>
                  <
p>&nbsp;</p>
                </
div>
              </
form>
            </
div></td>
            <
td width="36" background="../Images/Banner-Dwn3.PNG">&nbsp;</td>
          </
tr>
        </
table>
          </
div></td>
    </
tr>
    <
tr>
      <
td width="206" height="529" background="../Images/Left-Side.png"><div align="center">
          <
table width="130" border="0" cellspacing="0" cellpadding="0">
            <
tr>
              <
td height="39" background="../Images/Button.png"><div align="center" class="style2 style7 style10"><strong><a href="news.htm">Noticias</a></strong></div></td>
            </
tr>
            <
tr>
              <
td>&nbsp;</td>
            </
tr>
            <
tr>
              <
td height="39" background="../Images/Button.png"><div align="center" class="style20"><a href="interes.htm">De inter&eacute;s</a> </div></td>
            </
tr>
            <
tr>
              <
td>&nbsp;</td>
            </
tr>
            <
tr>
              <
td height="39" background="../Images/Button.png"><div align="center" class="style20"><a href="coments.htm">Comentarios</a></div></td>
            </
tr>
            <
tr>
              <
td>&nbsp;</td>
            </
tr>
            <
tr>
              <
td height="39" background="../Images/Button.png"><div align="center" class="style20"><a href="ayuda.htm">Ayuda</a></div></td>
            </
tr>
          </
table>
          <
p>&nbsp;</p>
          <
p>&nbsp;</p>
          <
p>&nbsp;</p>
          <
p>&nbsp;</p>
          <
p>&nbsp;</p>
          <
p>&nbsp;</p>
      </
div></td>
      <
td width="758" bgcolor="#FFFFFF"><div align="center">
          <
class="style2 style3"><strong>P&Aacute;GINA PRINCIPAL </strong></p>
          <
class="style7"><strong>P&aacute;gina de Prueba (Prototipo) </strong></p>
          <
class="style7"><strong>Trabajo de Grado:</strong></p>
          <
class="style7"><strong>&quot;Desarrollar un Software que permita automatizar las Inscripciones por Departamento de</strong></p>
          <
class="style7"><strong>Computaci&oacute;n y Sistemasv&iacute;a Internet&quot;</strong></p>
          <
p><img src="../Images/construct.png" width="100" height="100"></p>
          <
p>&nbsp;</p>
      </
div></td>
      <
td width="36" background="../Images/Right-Side.png">&nbsp;</td>
    </
tr>
    <
tr>
      <
td height="28" colspan="3"><div align="center"><img src="../Images/Botton.png" width="1000" height="28"></div></td>
    </
tr>
  </
table>
</
div>
</
body>
</
html
La página resultante es esta:

Click Aqui

Estoy planeando en mejorar el diseño físico (quizás un cambio en los botones, el banner y los colores) pero ese mismo diseño lo tengo en otros ficheros y me da lata tener que cambiar todo en todos, por eso quiero usar el CSS.

Mi pregunta es: Quñe parte del código que mostré puede ser llevada al archivo CSS (aparte del estilo). Puedo poner en ese archivo las tablas? Hacer algo como un template donde sólo tenga que meter la info.

Cualquier ayuda se las agradecería =)
  #2 (permalink)  
Antiguo 17/07/2007, 16:51
 
Fecha de Ingreso: febrero-2004
Ubicación: Resistencia - Argentina
Mensajes: 299
Antigüedad: 13 años, 9 meses
Puntos: 0
Re: Quiero usar CSS para pulir un código. Alguna recomendación?

en CSS podes hacer todo lo que tiene tu pagina y la verdad se puede mejorar mucho, podes empezar por hacer la diagramacion de nuevo con divs, el codigo se reduce muchisimo, cualquier problema que tengas postealo aca, te aconsejo que miras esta pagina:
http://www.csszengarden.com/
podes ir cambiando el archivo css e ir viendo como cambia la pagina, esto es sin tocar el html
  #3 (permalink)  
Antiguo 17/07/2007, 16:54
Avatar de ghosthead-nebula  
Fecha de Ingreso: marzo-2007
Mensajes: 273
Antigüedad: 10 años, 9 meses
Puntos: 3
Re: Quiero usar CSS para pulir un código. Alguna recomendación?

O sea que en el campo "body" tendría que poner todas las "divs" de las tablas? O.o?
  #4 (permalink)  
Antiguo 17/07/2007, 17:02
 
Fecha de Ingreso: febrero-2004
Ubicación: Resistencia - Argentina
Mensajes: 299
Antigüedad: 13 años, 9 meses
Puntos: 0
Re: Quiero usar CSS para pulir un código. Alguna recomendación?

si, dentro del campo body, algo asi:

.principal{
width:640px;
height:600px;
}
.menuizquierda{
width:200px;
height:500px;
background-color:#CCCCCC;
float:left;
}
.Centro{
float:left;
width:440px;
height:500px;
background-color:#003399;
}

<div class="principal">
<div>Encabezado</div>
<div class="menuizquierda">Menu de la izquierda
</div>
<div class="Centro">Centro
</div>
</div>

fijate como se reduce el codigo html y ya casi tenes la diagramacion que necesitas
  #5 (permalink)  
Antiguo 17/07/2007, 17:18
Avatar de hCanté
Colaborador
 
Fecha de Ingreso: marzo-2007
Ubicación: Guatemala
Mensajes: 233
Antigüedad: 10 años, 8 meses
Puntos: 9
Re: Quiero usar CSS para pulir un código. Alguna recomendación?

Hola..

Si, es que lo que deberias de hacer es poner tus etiquetas css en un archivo independiente, y tu codigo html va a estar mas limpio y ordenado, eso es gran parte ( si no es que todo ) la gracia de hacerlo con css.

En tu html solo tendrias que llamar a los divs y a tus etiquetas no definirlos en el html.

Saludos
hCanté
  #6 (permalink)  
Antiguo 17/07/2007, 21:29
Avatar de buzu  
Fecha de Ingreso: octubre-2006
Ubicación: San Francisco, CA
Mensajes: 2.168
Antigüedad: 11 años, 1 mes
Puntos: 122
Re: Quiero usar CSS para pulir un código. Alguna recomendación?

ya... eso lo puedes reducir a menos de la mitad, solo hazlo semantico y listo... en cuanto al CSS es muy poderoso pero hay que saver como usarlo... no toma tiempo aprender a usarlo como te dige en otro post, solo esfuerzo.
Pero si estas usando el DW como WYSIWYG no lograras lo que te digo... es pasarse a desarollar el codigo por ti misma, es entrar a un nuevo mundo pensar de otra manera....
  #7 (permalink)  
Antiguo 17/07/2007, 21:48
Avatar de ghosthead-nebula  
Fecha de Ingreso: marzo-2007
Mensajes: 273
Antigüedad: 10 años, 9 meses
Puntos: 3
Re: Quiero usar CSS para pulir un código. Alguna recomendación?

Gracias Roly. Lo intentaré.

Una duda: Para qué los "float"?


Cita:
Pero si estas usando el DW como WYSIWYG no lograras lo que te digo...
WYSIWYG? Qué es eso? O.o?
  #8 (permalink)  
Antiguo 17/07/2007, 22:38
 
Fecha de Ingreso: marzo-2005
Ubicación: Madrid
Mensajes: 233
Antigüedad: 12 años, 8 meses
Puntos: 5
Re: Quiero usar CSS para pulir un código. Alguna recomendación?

WYSIWYG?-> es un editor, mira en google.
float-> para poner un div "flotando" a un lado u otro de la pagina, es decir para maquetar.

buzu no estoy de acuerdo DW, es de lo mejor que hay, adobe en general, tiene las mejores herramientas del mercado.
  #9 (permalink)  
Antiguo 17/07/2007, 22:42
Avatar de ghosthead-nebula  
Fecha de Ingreso: marzo-2007
Mensajes: 273
Antigüedad: 10 años, 9 meses
Puntos: 3
Re: Quiero usar CSS para pulir un código. Alguna recomendación?

Cita:
float-> para poner un div "flotando" a un lado u otro de la pagina, es decir para maquetar.
O.o?

Flotando?

>.>

Perdonen mi ignorancia pero... qué se gana con esto? o.O?
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 17:17.