CSS - Parte 1

829 visualizações

Publicada em

0 comentários
0 gostaram
Estatísticas
Notas
  • Seja o primeiro a comentar

  • Seja a primeira pessoa a gostar disto

Sem downloads
Visualizações
Visualizações totais
829
No SlideShare
0
A partir de incorporações
0
Número de incorporações
530
Ações
Compartilhamentos
0
Downloads
3
Comentários
0
Gostaram
0
Incorporações 0
Nenhuma incorporação

Nenhuma nota no slide

CSS - Parte 1

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

×