O CSS (Cascading Style Sheets) é uma linguagem de estilo utilizada para definir a aparência e o layout de um documento HTML. Com o CSS, é possível separar o conteúdo do documento da sua apresentação visual, tornando a manutenção e a atualização do site mais fácil e eficiente.
Existem três formas de adicionar estilos CSS a um documento HTML:
- Estilos inline: são aplicados diretamente a um elemento HTML, utilizando o atributo "style".
- Estilos internos: são definidos dentro da seção "head" do documento HTML, utilizando a tag "style".
- Estilos externos: são definidos em um arquivo CSS separado e vinculados ao documento HTML através da tag "link".
Independentemente da forma escolhida, os estilos CSS são compostos por um seletor e um conjunto de propriedades e valores. O seletor é utilizado para escolher os elementos HTML que receberão os estilos, enquanto as propriedades e valores definem a aparência e o layout desses elementos.
Por exemplo, o seguinte código CSS define um estilo para todos os títulos h1 do documento:
h1 {
color: red;
font-size: 24px;
text-align: center;
}
Nesse caso, o seletor é "h1" e as propriedades e valores definem a cor do texto como vermelho, o tamanho da fonte como 24 pixels e o alinhamento do texto como centralizado.
Além das propriedades básicas de estilo, como cor, fonte e tamanho, o CSS oferece uma ampla variedade de propriedades para controlar a aparência e o layout dos elementos HTML. Algumas das propriedades mais comuns incluem:
- background-color: define a cor de fundo do elemento.
- border: define a borda do elemento, incluindo sua espessura, estilo e cor.
- padding: define o espaço interno do elemento, entre seu conteúdo e sua borda.
- margin: define o espaço externo do elemento, entre sua borda e o próximo elemento.
- display: define como o elemento é exibido na página, como bloco, inline ou flexível.
- position: define a posição do elemento na página, como estática, relativa ou absoluta.
Combinando essas propriedades e valores, é possível criar layouts complexos e personalizados para um site. No entanto, é importante lembrar que o CSS deve ser utilizado de forma responsável e eficiente, evitando o uso excessivo de estilos e garantindo a acessibilidade e usabilidade do site para todos os usuários.