¿Cuál es su estilo css?

Video: Tutorial CSS y HTML - Poner estilo CSS al codigo HTML [HD]

Uno de los aspectos más confusos de trabajar con CSS (Cascading Style Sheets) es que se puede escribir estilos de muchas maneras. Similar a escribir en prosa, sólo porque usted entiende las reglas básicas de la gramática y la ortografía no quiere decir que haya dominado la escritura en prosa concisa.

Video: Curso Basico de CSS - 7. Posicionamiento de cajas

CSS diseñadores experimentados pasan mucho tiempo breve la elaboración de CSS, claro que es fácil de editar y actualizar. Pero aquellos que son nuevos en CSS son propensos a escribir más de lo necesario y estilos para crear estilos redundantes.

No sólo código redundante tarde más en descargarse a un navegador web, es mucho más difícil de modificar o revisar más tarde. Y, el más redundante su código, más probable es que se ejecutará en los conflictos de estilo.

Video: 3. Aplicar CSS a una página web

He aquí cinco consejos para escribir estilos limpias y eficientes:

  • Nunca crear dos estilos cuando uno es suficiente. Por ejemplo, puede crear un estilo utilizando el selector de etiquetas de todas las etiquetas que cambian la familia de fuentes de sus titulares, y luego crear un segundo estilo utilizando un selector de clase que se puede aplicar a sus titulares para cambiar el color.

    Sin embargo, sería más eficiente para definir el color y la familia de fuentes en el mismo estilo. Recuerde que siempre puede volver atrás y editar un estilo de añadir otra regla si desea cambiar el formato del estilo.

  • Abreviar los códigos de color hexadecimales. Puede definir colores en CSS mediante la inclusión de todo el código de color hexadecimal. Sin embargo, cuando se utiliza códigos de colores que son repetitivas, lo que necesita para incluir sólo los tres primeros caracteres. Por ejemplo #ffffff es lo mismo que #fff- Ambos crearán el color blanco.

  • Utilice hojas de estilo externas. Se pueden definir estilos en una hoja de estilo interna en la parte superior de cada página web, o puede guardar sus estilos en un archivo externo con la extensión .css y adjuntar esa hoja de estilo a todas sus páginas web. hojas de estilo externas son inherentemente más eficientes, ya que permiten utilizar el mismo estilo en cualquiera o en todas las páginas en su sitio.

    Por ejemplo, si se define un estilo que hace que todos los titulares principales negrita, azul, y grande, el ahorro de ese estilo en una hoja de estilos externa le permite utilizar el mismo estilo para cada titular. Entonces, si más adelante decide que desea cambiar sus titulares a verde, se puede cambiar el estilo en una hoja de estilo externa y cambiar todos los titulares de una vez.

    Si había salvado los estilos en una hoja de estilo interna, que tendría que editar el estilo del título de cada archivo.

  • Desarrollar una convención de nomenclatura para sus estilos. Aunque se puede nombrar estilos creados con la clase o ID selectores lo que quiera, lo mejor es elegir estilos que tienen significado aparte del formato. Por ejemplo, si crea un estilo llamado .redHeadlines y más tarde decide que quiere toda su .redHeadlines a ser de color azul, que sea el resultado final será con un estilo del título azul llamado .redHeadlines o tendrá que cambiar el nombre del estilo.

    Y cambiar el nombre del estilo incluye ir y volver a aplicar ese estilo de todo el mundo que tiene un titular de color rojo que desea activar azul, que tipo de niega el poder de estilos para hacer cambios globales. Para evitar este problema, crear nombres de estilo que se refieren a la posición o la importancia de los elementos, tales como .mainHeadlines o .sidebarHeadlines.

  • *Probar y validar su código. Incluso los diseñadores CSS experimentados cometen errores, por lo que Dreamweaver incluye tantos grandes herramientas para probar y validar el código en sus páginas web. Asegúrese de probar su CSS para errores comunes.

    Los siguientes son dos servicios de pruebas en línea que puede utilizar para comprobar si hay errores en el código CSS. Basta con introducir la URL de cualquier página web en Internet en el campo de dirección en cualquiera de estos sitios y haga clic en el botón Enviar para recibir un informe que muestra los errores en su código:

Artículos Relacionados