1. Cascading Style Sheets Folha de Estilo em cascata Folha de estilo em cascata é um mecanismo simples para adicionar estilos (p.ex., fontes, cores, espaçamentos) aos documentos Web. A grande vantagem do uso de CSS é a de separar a marcação HTML, da apresentação do site.
2. Introdução Sintaxe seletor {propriedade: valor; } Seletor: é o elemento HTML, ex: <p> <h1> Propriedade: Atributo que será aplicado ao elemento HTML, ex: font, color, background. Valor: valor do atributo. Ex: letra tipo arial, cor azul. p { color: #FF0000; }
3. Inserir CSS no HTML Inline – declarado no HTML Ex: <p style=“color:#ff0000;”> Texto </p> Incorporadas – dentro do elemento <head> Ex: <head>... <styletype=“text/css”> p { color: #ff0000; } </style> </head>
4. Inserir CSS no HTML Externo – Arquivo externo com a extensão .css Está é a melhor forma de se inserir CSS em um site Ex: <head> <link rel=“stylesheet” type=“text/css” href=“estilos/principal.css” /> </head> ...
5. HTML e CSS <html><head><title>HTML e CSS</title> <styletype=“text/css”> h1{ color: blue; } body{ background-color: yellow; } </style> </head><body> <h1>Este texto está com a cor azul</h1> </body></html>
6. Agrupamento de Seletor Possibilita agrupar seletores que possuam declarações idênticas. Ex:Aplicar a cor vermelha aos títulos <h1> até <h6>: H1,h2,h3,h4,h5,h6{color:#FF0000;}