Upload
others
View
4
Download
0
Embed Size (px)
Citation preview
PROFª. M.Sc. JULIANA H Q BENACCHIO
INTRODUÇÃO AODESENVOLVIMENTO WEB
(Exercício Prático CSS - noticias1)
2
Exercício Prático CSS
Arquivo index.html - sem formatações de estilo
Av. Araucária, 780 Vila A Foz do Iguaçu/PR Telefone: (45) 34225300
3
Exercício Prático CSS
Arquivo index.html - com formatações de estilo
Av. Araucária, 780 - Vila A - Foz do Iguaçu/PR - Telefone: (45) 3422-5300
4
Exercício Prático CSS
<p> principal
<td> resumo<td> resumo
<td> titulo<td> titulo
<td> origem<td> origem
<table> tb1
<table> tb1 <a> link, visited, hover, active
Av. Araucária, 780 - Vila A - Foz do Iguaçu/PR - Telefone: (45) 3422-5300 <td> rodape
5
Exercício Prático CSS
Arquivo noticia1.html - sem formatações de estilo
6
Exercício Prático CSS
Arquivo noticia1.html - com formatações de estilo
7
Exercício Prático CSS
<p> ptitulo
<p> presumo<p> pautor
<p> ptexto
Arquivo noticia1.html - com formatações de estilo
8
Exercício Prático CSS
Arquivo noticia2.html - com formatações de estilo
9
Exercício Prático CSS
Regras CSS
- Tag <p>
• principal
• ptitulo
• presumo
• pautor
• ptexto
Arquivo noticia.css
Tag <td> titulo origem resumo rodape
Tag <a> link visited active hover
Tag <a> link visited active hover
– Tag <table> tb1
10
Exercício Prático CSS
Regras CSS
Tag <p>
• principal – Fonte Arial, negrito, itálico, tamanho 30px cor #280
• ptitulo – Fonte Arial, negrito, itálico, tamanho 25px, cor #006
• presumo – Fonte Arial, itálico, tamanho 20px
• pautor – Fonte Arial, negrito, itálico, tamanho 20px, cor #666
• ptexto – Fonte Arial, tamanho 15px
11
Exercício Prático CSS
Regras CSS
Tag <td>
• titulo – Fonte Arial, negrito, itálico, tamanho 15px, cor de fundo #FFF
• origem – Fonte Arial, negrito, tamanho 20px, cor de fonte #280, cor de fundo #FFF
• resumo – Fonte Arial, tamanho 12px, cor de fundo #FFF
• rodape – Fonte Arial, negrito, tamanho 11px, texto centralizado, cor de fundo #CFB
12
Exercício Prático CSS
Regras CSS
Tag <a>
• link – cor #0000FF
• visited – cor #DDC71A
• active – cor #AC0B44
• hover – cor #FF0000, negrito
13
Exercício Prático CSS
Regras CSS
Tag <table>
• tb1 – com borda sólida, com espessura de 1px na cor preta, largura da tabela 766 pixel, altura da tabela 36 pixel, cor de fundo da tabela #000033