O que é CSS

Esta é a primeira seção do tutorial de  introdução as CSS  e explica o que é CSS. Você criará um documento simples para trabalhar com CSS nelas nas próximas seções.

O que é CSS ?

Cascading Style Sheets (CSS) é uma linguagem para especificar como os documentos são apresentados aos usuários (Estilo do documento).

Um documento é um conjunto de informações que são estruturadas utilizando uma linguagem de marcação.

Examples
  • Um documento, é uma página da web como esta que você está lendo.
    A informação que você vê em uma página web  é geralmente estruturado utilizando a linguagem de marcação HTML (HyperText Markup Language).
  • Dialogos, também chamados de Janelas Modais de um aplicativo,  são frequentemente documentos.
    Tais diálogos podem também ser estruturados usando linguagem de marcação, como XUL. Este é frequentemente o caso em aplicações Mozilla, mas não é um caso comum.

Neste tutorial, temos boxes com o título Mais detalhes como o box abaixo, contento informações opcionais. Se você estiver com pressa para avançar com este tutorial, sinta-se a vontade para ignorar estas boxes e avançar com o tutorial, talvez lê-lo mais tarde. Caso contrário lê-los quando chegar a eles, e talvez siga os links para saber mais.

Mais detalhes

Um documento não é a mesma coisa que um arquivo, ele pode ou não estar armazenado em um arquivo.

Por exemplo, o texto que você está lendo agora não é armazenado em um arquivo. Quando seu navegador solicita esta pagina, o servidor consulta um banco de dados e gera o documento, reunindo partes do documento a partir de muitos arquivos. No entanto, neste tutorial você irá trabalhar com documentos que estão armazenados em arquivos.

Para mais informações sobre documentos e linguagens de marcação, consulte outras partes deste exemplo de site de web:

HTML para paginas web
XML para documentos estruturados em geral
SVG para gráficos
XUL para interfaces de usuários em Mozilla

Na Parte II deste tutorial você verá exemplos dessas linguagens de marcação.

Apresentar um documento ao usuário significa convertê-lo em uma forma que os seres humanos possam fazer uso. Navegadores como Firefox, Chrome ou Internet Explorer, são projetados para apresentar documentos visualmente  — por exemplo, na tela de um computador, projetor ou impressora.

Mais detalhes

CSS não é apenas para navegadores, e nem apenas para apresentação visual. Na terminoloia formal de CSS, o programa que apresenta  um documento a um usuário  é chamado de user agent (UA), no Brasil agente de usuário. Um navegador é apenas um UA. No entanto, na parte I deste Tutorial você vai apenas trabalhar com CSS no navegador.

Para mais definições formais sobre  terminologia relacionadas com CSS, veja Definições na especificação CSS.

Ação: Criando um documento

  1. Use seu computador para criar um novo diretório e um novo arquivo de texto dentro deste dire†ório. O arquivo terá o documento.
  2. Copie e cole o código HTML abaixo . Salve o arquivo usando o nome doc1.html
    <!DOCTYPE html>
    <html>
      <head>
      <meta charset="UTF-8">
      <title>Documento de exemplo</title>
      </head>
    
      <body>
        <p>
          <strong>C</strong>ascading
          <strong>S</strong>tyle
          <strong>S</strong>heets
        </p>
      </body>
    </html>
    
  3. No seu navegador, abra uma nova aba ou uma nova janela, e abra o arquivo que você acabou de salvar.

    Você deve ver o texto  com as letras iniciais em negrito, como este:

    Cascading Style Sheets

    O que você vê no seu  navegador, pode não ser exatamente o mesmo que este, por causa das configurações em seu navegador e neste tutorial. Se existirem diferenças nas fontes espaçamentos ou cores que você vê, elas não são importantes.

O que veremos depois?

Seu documento ainda não usa CSS. Na próxima seção você usará CSS para especificar o estilo.

Etiquetas do documento e colaboradores

 Colaboradores desta página: agathasilva28, rogeralbinoi, teoli, nickollas.coelho
 Última atualização por: agathasilva28,