Que es CSS

En esta página se explica que es CSS. Usted creará un documento simple con el cual trabajará en las próximas páginas del tutorial.

Esta es la primera sección del tutorial Como iniciar.
Siguiente sección: Por qué usar CSS

Información: ¿Qué es CSS?

Cascading Style Sheets (CSS), traducido literalmente al español, como Hojas de estilo en cascada, es un lenguaje para la especificar cómo los documentos se presentan a los usuarios.

Un documento (document) es una colección de información que está estructurado utilizando un lenguaje de formato (markup language).

Ejemplos
  • Una página web como la que estás leyendo, es un documento.
    La información que ves en una página web usualmente está estructurada utilizando el lenguaje de formato de documentos de HiperTexto, HTML (HyperText Markup Language).
  • Un cuadro de diálogo en una aplicación Mozilla es un documento.
    Los controles de interfaz de usuario que pude ver en los diálogos de control de aplicaciones Mozilla, están estructurados utilizando el lenguaje de formato XUL (XML User-interface Language - Lenguaje XML de interfaces de usuario).

En este tutorial, los cuadros con titulo Más detalles, como el que está a continuación, contienen información adicional. Si se cuenta con poco tiempo para progresar con el tutorial, entonces pude omitir estos cuadros, quizás retorne a leerlos luego. De lo contrario léalos cuando llegue a ellos y tal vez siga los enlaces que contienen para aprender más.

Más detalles

Un documento no es lo mismo que un archivo. Y este puede o no estar almacenado en un archivo.

Por ejemplo, el documento esta leyendo en este momento no está almacenado en un archivo. Cuando su navegador web solicita esta página, el servidor consulta a la base de datos y genera el documento, obteniendo las partes del mismo de diferentes archivos. Sin embargo, en este tutorial se trabajará con documentos que se almacenan en archivos.

Para más información acerca de documentos y lenguajes de formato, visite otras partes de este sitio web—por ejemplo:

HTML para páginas web
XML para documentos estrucurados, en general
SVG para gráficas
XUL para interfaces de usuario de Mozilla

En la parte II de este tutorial podrá ver ejemplos de estos lenguajes de formato.

Presentar un documento a un usuario significa convertirlo en una forma en que el humano pueda hacer uso de el. Mozilla está diseñado para presentar documentos de manera visual—por ejemplo, en la pantalla de una computadora, en un proyector o en una impresora.

Más detalles
CSS no es sólo para los navegadores web, y no sólo para la presentación visual. En terminos formales CSS, el programa que presenta un documento a un usuario es llamado un agente de usuarios (UA - User Agent). Un navegador es sólo un tipo de UA. Sin embargo, en la parte I de este tutorial, se trabajará únicamente con CSS en un navegador.

Para algunas de las definiciones formales de la terminología relacionda con CSS, consulte el enlace Definiciones (en ingles) en la especificación CSS.

Acción: Crear un documento

  1. Utilice su computador para crear un nuevo directorio y un nuevo archivo de texto allí. El archivo contendrá el documento.
  2. Copie y pegue el código HTML que se muestra a continuación. Guarde el archivo con el nombre doc1.html
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
    "http://www.w3.org/TR/html4/strict.dtd">
    <html>
      <head>
      <meta http-equiv="Content-Type" content="text/html;
      charset=iso-8859-1">
      <title>Sample document</title>
      </head>
    
      <body>
        <p>
          <strong>C</strong>ascading
          <strong>S</strong>tyle
          <strong>S</strong>heets
        </p>
      </body>
    </html>
    
  3. En el navegador web, abra una nueva pestaña o una nueva ventana, y abra el archivo allí.

    Debe observar un texto con las letras iniciales en negrita, así:

    Cascading Style Sheets

    Lo que ve en el navegador puede no lucir exactamente como en la imagen, debido a la configuración de su navegador web y esta wiki. Si existen algunas diferencias en el tipo de fuente, espaciado y los colores que ve, no son importantes.

¿Qué sigue?

Si ha tenido dificultad para entender esta página, o si tiene comentarios acerca de ella, por favor contribuya con esta en la página de Discusiones.

El documento aún no utiliza CSS. En la siguiente página se utilizará CSS para especificar el estilo: ¿Por qué utilizar CSS?

Etiquetas y colaboradores del documento

Etiquetas: 
 Colaboradores en esta página: aguilarcarlos, teoli, LeoHirsch, dusvilopez, turekon, Izel
 Última actualización por: aguilarcarlos,