O que é CSS [Cascading Style Sheets]?

A internet não seria a mesma se não fosse o CSS, a linguagem de estilos mais utilizada no design de sites e aplicativos web

Diego Melo
Por
• Atualizado há 1 ano e 5 meses
O que é CSS? / Negative Space / Pexels
Exemplo de código CSS (Imagem: Negative Space / Pexels)

CSS é a sigla para Cascading Style Sheets (ou Folha de Estilos em Cascata, em tradução livre). Trata-se de uma linguagem de formatação de conteúdo muito utilizada em conjunto com o HTML na construção de páginas da internet, sendo responsável pelo “visual” do site. Saiba mais sobre essa tecnologia útil tanto para programadores quanto para web designers.

O que é CSS?

O CSS foi desenvolvido em meados da década de 90 para solucionar um problema criado pela expansão da própria internet. Com a popularização da rede, as páginas foram ficando cada vez mais complexas, e os recursos do HTML já não eram mais suficientes para atender às necessidades dos desenvolvedores.

Sua primeira função foi a de separar os códigos de estruturação e apresentação do conteúdo, tornando-os mais simples de serem escritos e atualizados. Dessa forma, ao invés de utilizar tags e elementos de HTML ou XML para criar cores, fontes e layout, eles passaram a ser configurados nas folhas de estilo.

O CSS permite modificar o visual de vários elementos ou seções diferentes de uma mesma página de uma só vez. Além de adicionar animações e outros recursos visuais, também é possível determinar que os elementos sejam renderizados de maneira diferente de acordo com a tela ou resolução do dispositivo, técnica conhecida como “design responsivo”.

O que é CSS? / Mika Baumeister / Unsplash
Programador trabalhando com CSS (Imagem: Mika Baumeister / Unsplash)

Como funciona?

O CSS tem uma sintaxe simples, com nomes em inglês para especificar diferentes propriedades de uma página. O código pode ser escrito dentro de uma tag de abertura de um elemento HTML (chamado de método “inline”), incorporado em uma seção do cabeçalho do documento, ou em um arquivo separado, que então é importado ou linkado na página.

Quando o CSS é externo ou incorporado, os elementos da página afetados pelos estilos são identificados pelos seletores. Eles podem ser aplicados a todos os elementos de um tipo específico, ou apenas àqueles que correspondem a um determinado atributo ou identificação. Veja abaixo um exemplo de um código CSS que customiza todas as fontes de um site.

html {
  font-family: sans-serif;
  line-height: 1.15;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;

Bootstrap e outros frameworks CSS

Os frameworks de CSS são bibliotecas que agregam funções e classes pré-definidas para serem aplicadas em diversos elementos HTML, como botões, tabelas, parágrafos, etc.

Eles simplificam a customização desses elementos e a criação de layouts mais complexos, adotando padrões de código e de estilo que podem, ou não, serem personalizáveis.

Alguns frameworks também adicionam suporte a recursos mais avançados utilizando JavaScript. O Bootstrap, criado pelo Twitter em 2011, é um dos mais populares. Outros frameworks conhecidos são Foundation, Bulma e Talwind.

Relacionados

Escrito por

Diego Melo

Diego Melo

Ex-redator

Diego Melo é jornalista e cursa Análise e Desenvolvimento de Sistemas. Escreve sobre tecnologia desde 2011, fez parte da equipe do Tecnoblog entre 2016 e 2022, produzindo pautas sobre programação, guias e tutoriais de programas. Hoje é desenvolvedor full-stack e trabalha diariamente com tecnologias como JavaScript (Vue.js), PHP (Laravel) e SQL (MySQL).

Temas populares