Introdução

CSS, ou Cascading Style Sheets, é uma linguagem de marcação usada para definir a aparência e o layout de páginas da web. Ela é composta por regras que especificam como os elementos HTML devem ser exibidos no navegador.

CSS é uma linguagem poderosa que permite aos desenvolvedores web criar páginas da web personalizadas e responsivas. Com CSS, é possível controlar a cor, o tamanho, a fonte, a borda, a margem e outros aspectos da apresentação dos elementos HTML. O CSS também pode ser usado para criar efeitos visuais, como animações e transições.

O CSS é uma parte essencial do desenvolvimento web. É uma ferramenta fundamental para criar páginas da web bonitas e funcionais.

Objetivos da aula

●      Definir o conceito de CSS.

●      Discutir a estrutura básica do CSS.

●      Identificar forma de implementar CSS.

O que é o CSS e como é sua sintaxe

O CCS, é o acrônimo de Cascading Style Sheets, cuja tradução para português significa Folhas de estilo em cascata. É uma linguagem usada para formatar a apresentação de uma página em HTML no navegador. Os padrões desta linguagem são definidos pelo W3C, mesmo consórcio que define os padrões para a linguagem HTML.

O CSS foi criado em 1996 para remover da página HTML o estilo, que antes era atribuído por tags como <font> que eram um pesadelo para desenvolvedores pois se aplicavam a cada elemento HTML. Para resolver esse problema, o World Wide Web Consortium (W3C) criou o CSS, que economiza muito trabalho controlando o layout de várias páginas da web de uma só vez. O CSS atualmente está em sua terceira versão.

A linguagem CSS é utilizada para definir propriedades de elementos HTML, como cores, fontes, tamanhos de texto, espaçamento entre elementos, posicionamento dos elementos, definição de imagens de fundo ou cores de fundo e variações de exibição para diferentes dispositivos e tamanhos de tela. A palavra “cascata” significa que um estilo aplicado a um elemento pai também se aplicará a todos os elementos filhos dentro do pai.

A sintaxe do CSS compõe-se de um seletor, abertura de chaves, declaração de propriedade e valor para esta, como no exemplo a seguir, onde atribui-se ao seletor p a fonte verdana e o tamanho de 20px.

p {
		font-family: verdana;
		font-size: 20px;
}

• O seletor aponta para o elemento HTML que se deseja estilizar.
• O bloco de declaração contém uma ou mais declarações separadas por ponto e vírgula.
• Cada declaração inclui um nome de propriedade CSS e um valor, separados por dois pontos.
• Os blocos de declaração são cercados por chaves.

Formas de adicionar CSS ao documento HTML

Existem três formas de adicionar CSS a uma página HTML: