Nunca esta demas saber como programar a partir del block de notas algun script, como por ejemplo una página html, css, etc.

Pero los tiempos que corren no estan para demorarse demasiado desarrollando, a menos que lo hagas por gusto y no tengas un reloj marcando las horas que faltan para alguna entrega, lo ideal es contar con alguna herramienta que te facilite el trabajo, un generador de código por ejemplo. En este partícular, he visto algunos y yo desarrolle uno que a partir de una tabla de base de datos MS SQL  me genera la estructura del código de negocios de una aplicación , y otro script que al entregarle un procedimiento almacenado genera un Web Services en VB.Net (si alguien lo solicita puedo compartir el código de esa aplicación).  Pero en donde estoy aun un poco  trabajando con notepad (por decirlo de alguna manera) es en el diseño de la interfaz de usuario. No me gusta usar tablas, sino trato de utilizar solo divs, y por supuestos respetar el estandar. Todo este comentario, se refiere a que encontre una utilidad que permite crear cuadros redondeados usando solo divs y nada de imagenes, las pruebas que realize me parecieron satisfactorias, el unico problema  es que para mostrar un cuadro la herramienta genera en el html 15 lineas de código mas una hoja de estilo.

Les dejo el link para que hagan sus propias pruebas:

http://www.spiffycorners.com

Bookmark It

Hide Sites

Estaba buscando algo como esto. Util para quienes no logran diseñar un css que se vea bien con todos los navegadores. Una tabla de compatibilidad:
http://www.richinstyle.com/bugs/table.html

Bookmark It

Hide Sites

Ocupo mi blog para recordar links e información que en algun minuto puedo necesitar, de modo que muchas veces es el punto de partida en la navegación. Estoy pensando en fundir los post de temas relacionados hacerles una edición y mejorar el contenido, por lo que por ahora seguire juntando información, de modo que no solo sea importante para mi y para un par de visitantes sino para mucha gente:

Links sobre css

Las especificaciones de css
http://www.w3.org/Style/CSS/#specs
Validación de css

http://jigsaw.w3.org/css-validator/

Ventajas de usar css

http://www.maestrosdelweb.com/editorial/usarcss/

Ejemplos de css

http://www.csszengarden.com/

http://www.camaleoncss.com

 Tips

http://www.artypapers.com/csshelppile/

 

 

Bookmark It

Hide Sites

Definitivamente me acabo de convencer de que no se puede hacer una página con css que se vea igual en todos los navegadores. Prueba de ello es este artículo que prueba con distintos navegadores.

De todas formas se puede determinar el navegador del visitante con Javascript:

if (navigator.appName==”Microsoft Internet Explorer”){

}

o

if (navigator.appName==”Netscape”){

}

y en teoria se puede asignar una hoja de estilo de forma dinamica, cosa que estoy probando:

document.styleSheets(0).href=”../themes/estandarie/login.css” mce_href=”../themes/estandarie/login.css” ;

En este otro artículo explica que si se puede lograr que una página se vea igual en todos los navegadores http://www.vib.cl/?p=124, aunque de acuerdo a mi experiencia, por mas que valide un css de acuerdo a la norma W3C no se ve igual en IE o Firefox.

Una implementación de lo que hablo la encontré en este link

http://www.desarrolloweb.com/articulos/estilos-css-distintos-navegador-javascript.html

 

 

Bookmark It

Hide Sites

A continuación listo una hoja de estilo con la cual se puede formatear un formulario el cual esta dentro de DIV sin tablas, donde la gráfica queda absolutamente independiente de los fuentes donde esta la definición del formulario.

/* CSS Document */
body{
font: 12px/16px Geneva,Arial,Tahoma,sans-serif;
}

fieldset{
border:#26a solid 1px;
width : 300px;
}

legend {
background:#fb0;
border: #776 solid 1px;
padding:1px 10px;
}

label{
width:7em;
float:left;
text-align:right;
margin:0 1em 10px 0;
clear:both;
}

input{
margin-bottom:10px;
color:#26a;
background:#feb;
border:#26a solid 1px;
}

select{
margin-bottom:10px;
color:#26a;
background:#feb;
border:#26a solid 1px;

}

button{
margin-left:5em;
clear:both;
color:#000;
background:#fb0;
border:2px #9cf outset;
}

#toolbar{
background:#feb;
border:2px #9cf outset;
height:40px;
}

#formulario{

}

#grid{
background:#feb;
border:2px #9cf outset;
height:40px;

}

Bookmark It

Hide Sites