html CRIANDO MENU EM HTML COM CSS

**TheScription2016** · 20 de Novembro 2016

A função do CSS é definir regras de formatação e estilo de texto dentro de páginas web, então em nosso sistema de hoje vamos usar uma página em HTML e uma em CSS para criar um menu que mude de cor, o que gera um efeito muito interessante para sua página.

Primeiramente vamos criar nossa página em HTML com o nome menu.html para criar está página poremos usar varias ferramentas, como Notepad++ um ótimo editor de código e que pode ser encontrado facilmente na internet para download.

Criando o menu em HTML para criarmos o menu primeiro vamos criar uma lista não ordenada (tag UL), com 5 itens contendo um link cada um. Isto deve ser feito diretamente na página HTML, com o seguinte código.

É necessário se cadastrar para acessar o conteúdo.

Lembrando que este código deve estar entre as tags <body></body> de sua página.

Cada item LI será um botão do nosso menu, e cada um deles terá seu respectivo link.

Até aqui temos a lista dos links para as páginas que você deseja. Porém como o CSS ira funcionar? Nós colocamos o seguinte comando no topo de nossa página para chamar a folha de estilos:

É necessário se cadastrar para acessar o conteúdo.

Então até agora nossa página se encontra assim.

É necessário se cadastrar para acessar o conteúdo.

Agora iremos criar o arquivo chamado css.css na mesma página que nosso página html, podemos criar em outro lugar porem teremos que alterar o destino no começo de nossa página html.

CRIANDO UMA PÁGINA CSS

Para criação de nossa página de CSS nós temos algumas características que mudam e que podem fazer uma grande diferença futuramente nós podemos comentar algumas linhas, linhas comentadas estão entre as tags /* e */ ou seja tudo que estiver dentro destra linha não será lida pelo sistema portanto podemos comentar o que cada parte do código ira fazer, este tipo de coisa que parece pouco importante pode fazer realente uma grande diferença.

A estrutura de uma página css também é diferente de uma html, pois ela não começa com nenhuma tag html.

Dentro da página CSS, nós iremos colocar o estilo para cada elemento de nosso menu.

Primeiramente iremos atribuir características de fontes para toda a página, apenas para uma melhor exibição:

É necessário se cadastrar para acessar o conteúdo.

Os próximos códigos vamos usar para poder retirar a marcação dos itens da lista, bem como colocá-los sempre na mesma linha, uma vez que, por padrão, eles vem um embaixo do outro. Vamos também redefinir as margens internas e externas.

É necessário se cadastrar para acessar o conteúdo.

Agora vamos definir o estilo dos links, para que a visualização dos mesmos fique mais agradável.

É necessário se cadastrar para acessar o conteúdo.

O código completo de nossa página CSS fica assim:

É necessário se cadastrar para acessar o conteúdo.

[/b]

Entrar

Quem está por aqui 0 membros estão online

html CRIANDO MENU EM HTML COM CSS

Posts Recomendados

TheScription2016 45

Link para o comentário

Compartilhar em outros sites

Conteúdo Similar

Guia Completo para Spoofar + BypassTPM VAN:RESTRICTION

Como Spoofar Notebook Lenovo com BIOS Insyde Protegida e Jogar Valorant Sem BAN!

[Tutorial] Como criar seu tópico - Iniciantes

tutorial O que é Flood?

Dicas de Proplayers para Dominar Cada Agente no Valorant

Fóruns

Todas Atividades

Lojinha WC

Informação Importante