Menu Simples em HTML e CSS

12 de julho de 2018

Ao adentrar aos estudos de HTML e CSS é necessário ter de certa forma não só o que se passa como simples mas também ao avançado, compreender o que se deve dar de esforço para mostrar que é uma linguagem simples e poderosa para saber que ou o quê se dará como usual durante os projetos em que você caminha para saber que se precisa manter os olhares aficionados por algo em que não pode passar despercebido.

Até então é necessário você treinar e ver diferentes linhas de códigos para saber que nada está se deixando passar para compreender que é necessário treinar a paciência, o olho, e as unhas em que você irá conseguir digitar ainda muitas linhas em sua IDE até transformar-se em algo que não pode deixar de mão até que se de alguma forma você não entenda será preciso recorrer a web, que como poderosa ferramenta traçou a carreira de muitos profissionais em início de carreira.

Ao iniciar sua carreira será necessário adentrar às poderosas ferramentas que com linguagens técnicas e simples de vez em quando dependendo da IDE transforme um mundo que você não deixará passar despercebido e começará a gostar.

Ao momento apresento um menu simples desenvolvido para mérito de ensino traçado como básico para dar iniciativa do necessário para ir compreendendo de forma fácil e atraente aos olhos do profissional que está iniciando carreira.

Atente que você deve copiar o código e salvá-lo como um arquivo com extensão .html para que posteriormente testá-lo no seu navegador.

Verificar o menu no navegador, clique aqui. O código do arquivo encontra-se abaixo.

arquivo: INDEX.HTML

* {
padding:0;
margin:0;
}

.menu {

list-style-type:none;
}

.menu li a {
float:left;
padding:10px 30px;
background:#f50495;
text-decoration:none;
color:#ffffff;
margin-right:1px;
}

.menu li a:hover {
float:left;
padding:10px 30px;
background:#4f0495;
text-decoration:none;
color:#ffffff;
margin-right:1px;
}
</style>

</head>

<body>

<ul class=”menu”>
<li><a href=”#”>HOME</a></li>
<li><a href=”#”>SOBRE</a></li>
<li><a href=”#”>SINOPSE</a></li>
<li><a href=”#”>CONTATO</a></li>
</ul>

</body>

</html>

Sobre
Últimos Posts

Fábio Pereira

Audaz sobre as incertezas e certezas de profissional de tecnologia da informação, transpassado para o lado da ciência moderna, incluindo não apenas o critério da análise, bem assim também como o seu desenvolvimento e infraestrutura, capaz de realizar procedimentos com média de 7.86 segundos de precisão sobre todo e qualquer problema de ordens lógica, e ávido sobre a importância da computação em nossas vidas.

Últimos posts por Fábio Pereira (exibir todos)

Iniciando no Mundo do Marketing: Fundamentos e Princípios Essenciais - 17 de abril de 2024
Preço Dinâmico em E-commerce: Aproveitando Dados em Tempo Real - 17 de abril de 2024
Preço Dinâmico: Ajustando Preços de Acordo com a Demanda - 17 de abril de 2024

Menu Simples em HTML e CSS

Artigo Relacionados: