folhas de estilo em cascata fornecem um mecanismo para adicionar estilos para páginas web e separando semântica página de apresentação do conteúdo da página. CSS foi originalmente desenvolvido para resolver problemas introduzidos pela inclusão de informações de estilo em tags HTML , uma prática que levou ao código HTML incontrolável e caro. As folhas de estilo fornecer aos desenvolvedores a capacidade de estilizar a aparência das páginas web de uma forma consistente e extensível , reservando tags HTML para a descrição do conteúdo em si . Coisas que você precisa
editor de texto
browser
Show Mais instruções
Como formatar páginas da Web usando uma folha de estilo externa
1

Abra um texto editor e criar um novo arquivo . Nomeie o arquivo myStyleSheet.css .
2

Editar myStyleSheet.css . Adicionar um estilo para o arquivo que as cores "

" tags utilizadas em qualquer página da web que faz referência myStyleSheet.css vermelho. Salvar e fechar myStyleSheet.css

p

{

color: red; }

.
3

Voltar para o editor de texto e criar um novo arquivo . Nomeie o arquivo useExternal.html e salve-o no mesmo local que myStyleSheet.css .
4

Editar useExternal.html . Adicione um pouco de HTML para o arquivo que inclui um colar aberto " " tag, um HTML " " tag aberta, um HTML fechar " " tag, um HTML aberto " " tag, um HTML fechar" " tag e um HTML fechar" "
5

Continuar editando useExternal.html . Adicione um link para myStyleSheet.css na seção " " do arquivo. Defina o valor " href " para " myStyleSheet.css " , o valor "rel " para "text /estilo " eo valor " tipo" para "text /css" .

< br >

6

Continuar editando useExternal.html . Adicionar um HTML "

" tag de cabeçalho para o arquivo na seção " " , defina o cabeçalho com o texto " Texto do cabeçalho " e feche o "< /h1 >" tag .

Texto do cabeçalho

7

Continuar editando useExternal.html . Adicionar um "

" tag de parágrafo HTML para o arquivo após a tag "

" , defina o texto do parágrafo para "Parágrafo Texto" e fechar a tag "

" . Salvar e fechar useExternal.html .

< Ligação href = " myStyleSheet.css " rel = tipo de " estilo " = "text /css" >

texto do cabeçalho

parágrafo de texto

8

Abrir useExternal.html em um navegador da web . Verifique se o texto colocado dentro do "

" e "

" tags é de cor vermelha.
Como formatar um página da Web usando uma folha de estilo interna

9

Abra um editor de texto e criar um novo arquivo chamado useInternal.html . Adicione um pouco de HTML para o arquivo que inclui um colar aberto " " tag, um HTML " " tag aberta, um HTML fechar " " tag, um HTML aberto " " tag, um HTML fechar" " tag e um HTML fechar" "
10

Continuar editando useInternal.html . Adicionar um estilo entre o " " e " " tags que cores qualquer texto que usa a tag "

" azul .

< estilo
11

Continuar editando useInternal.html . Adicionar um HTML "

" tag de cabeçalho para a seção " " do arquivo e definir o texto do cabeçalho para " Texto do cabeçalho " . Feche a tag "

" .

< Estilo Texto

12

Continuar editando useInternal.html . Adicionar um "

" tag de parágrafo HTML para o arquivo após a tag "

" e defina o texto do parágrafo para "Parágrafo texto". Feche a tag "

" e salvar e fechar useInternal.html .

< Estilo Texto

parágrafo de texto

13

Abrir useInternal.html em um navegador web. Verifique se o texto colocado dentro do "

" e "

" tag é de cor azul.
Como formatar uma página da Web usando uma folha em linha Estilo

14

Abra um editor de texto e crie um novo arquivo chamado useInline.html . Adicione um pouco de HTML para o arquivo que inclui um colar aberto " " tag, um HTML " " tag aberta, um HTML fechar " " tag, um HTML aberto " " tag, um HTML fechar" " tag e um HTML fechar" "
15

Continuar editando useInline.html . Adicionar um HTML "

" tag de cabeçalho na seção " " do arquivo , defina o cabeçalho com o texto " Texto do cabeçalho " e feche o "< /h1 >" tag .

Texto do cabeçalho

16

Continuar editando useInline.html . Adicionar um "

" tag de parágrafo HTML para o arquivo após a tag "

" , defina o texto do parágrafo para "Parágrafo Texto" e fechar o "

" tag.

Texto do cabeçalho

parágrafo de texto

17

Continuar editando useInline.html . Edite o "

" tag de parágrafo e adicionar um parâmetro de " estilo " que as cores de qualquer texto que usa a "

" verde tag.

< , head>

Texto do cabeçalho

Parágrafo Texto

18

Abrir useInline.html em um navegador web. Verifique se o texto colocado dentro do "

" e "

" tag é de cor verde.