Que es CSS

Facebooktwittergoogle_plusredditpinterestlinkedintumblrmail

Que es CSS

Que-es-CSS-carlosmarca-wordpress-glosario
  • CSS significa Hojas de Estilo en Cascada. Viene de las siglas en Inglés: Cascading Style Sheets.
  • CSS describe cómo los elementos HTML se mostrarán en la pantalla, papel o en otros medios. Ayuda a ajustarlos a la forma y colores y estilos en general que se desee.
  • CSS ahorra mucho trabajo. Puede controlar el diseño de múltiples páginas web a la vez. Las hojas de estilo externas se almacenan en archivos CSS. Al modificar una hoja de estilo, modifica todas las páginas que lo contengan. Aunque se puede hacer cambios CSS a una página en específico , sabiendo el id de la misma.

CSS es un lenguaje de hojas de estilos creado para controlar el aspecto o presentación de los documentos electrónicos definidos con HTML y XHTML. CSS es la mejor forma de separar los contenidos y su presentación y es imprescindible para crear páginas web complejas.

Separar la definición de los contenidos y la definición de su aspecto presenta numerosas ventajas, ya que obliga a crear documentos HTML/XHTML bien definidos y con significado completo (también llamados “documentos semánticos”). Además, mejora la accesibilidad del documento, reduce la complejidad de su mantenimiento y permite visualizar el mismo documento en infinidad de dispositivos diferentes.

Al crear una página web, se utiliza en primer lugar el lenguaje HTML/XHTML para marcar los contenidos, es decir, para designar la función de cada elemento dentro de la página: párrafo, titular, texto destacado, tabla, lista de elementos, etc.

Una vez creados los contenidos, se utiliza el lenguaje CSS para definir el aspecto de cada elemento: color, tamaño y tipo de letra del texto, separación horizontal y vertical entre elementos, posición de cada elemento dentro de la página, etc.

Algunos ejemplos

Cambiar el color de los links:

a:link {
  color: #c5342b;
}

a:visited {
  color: #0000;
}

a:hover {
  color: #c3c3c3;
}

a:active {
  color: #9a9a9a;
}

Alinear elementos al centro:

.center {
  display: block;
  margin: auto;
}

Quitar el subrayado de los links:

a {
  text-decoration: none;
}

Ajustar los padding (espacios) de una imagen:

img {
  padding-top: 30px;
  padding-right: 15px;
  padding-bottom: 60px;
  padding-left: 15px;
}

Hacer un botón con un link:

a:link, a:visited, a:hover, a:active {
  background-color: #000;
  color: #fff;
  padding: 20px 35px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
}

Hay muchísima más información que añadir de los CSS.

La idea de este Post es solamente a manera de definición.

Ya iré haciendo más post referentes al tema.

Igualmente dejo algunos enlaces para ampliar la información.

Lecturas para ampliar la información

Wikipedia

W3Schools.com

Facebooktwittergoogle_plusredditpinterestlinkedintumblrmail

1 Comentario

Enviar un comentario

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.

Contáctame

¿Te puedo ayudar?

Soy especialista de WordPress. Me encuentro en Barcelona-España. Me dedico a enseñar lo que sé de WordPress, tanto individualmente, como en formaciones para empresas. Doy clases particulares de WordPress, tanto presenciales como On-line.

Por supuesto que también invierto parte de mi tiempo en el desarrollo web en WordPress para mis clientes, o en la asesoría a los mismos.

Si estás interesado en clases particulares de WordPress, o en algún desarrollo basado en WordPress, contáctame.

Dirección

Barcelona. España.
Teléfono: +34.633.508.224

WhatsApp chat

Mis Redes Sociales

Envíame tu mensaje

Puedes leer mi Política de Privacidad antes, si así lo deseas.

Uso de cookies

Esta web usa cookies operativas propias que tienen una pura finalidad funcional y cookies de terceros (tipo analytics) que permiten conocer sus hábitos de navegación para darle mejores servicios de información. Si continuas navegando, aceptas su uso. Puedes cambiar la configuración, desactivarlas u obtener más información en nuestra política de cookies.

ACEPTAR
Aviso de cookies
WhatsApp chat