Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Podem me ajudar?
Preciso colocar um menu "DropDown" na "Nav Bar"... mas tô me quebrando hahahaha
o que estou fazendo de errado?
<!DOCTYPE html>
<html lang="pt-br">
<head>
<!-- Última versão CSS compilada e minificada -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"><!-- Tema opcional -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">
<!-- Última versão JavaScript compilada e minificada -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<title>::: TESTE :::</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style>
.dropdown {
position: relative;
display: inline-block;
}
.dropdown-content {
display: none;
position: absolute;
background-color: #f9f9f9;
min-width: 160px;
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
padding: 12px 16px;
z-index: 1;
}.dropdown:hover .dropdown-content {
display: block;
}
</style>
</head>
<body>
<nav class="navbar navbar-default">
<div class="container-fluid">
<div class="navbar-header">
<!--<img width="80px" height="30" src="#" title="seu texto" vspace="10px"/>-->
</div>
<ul class="nav navbar-nav">
<li class="nav-item"><a class="nav-link" href="#" target="a_blank">HOME</a></li>
<li class="nav-link"><a href="#" target="a_blank">LINK A</a></li>
<li class="nav-link"><a href="#" target="a_blank">LINK B</a></li>
<li class="nav-link"><a href="#">LINK C</a></li>
<li><a href="#">LINK D</a></li>
<li><a href="#">LINK E</a></li>
<li><a href="#">LINK F</a></li>
<li><a href="#" target="a_blank">LINK G</a></li>
<div class="dropdown">
<div class="dropdown-content" id="myDropdown">
<a href="#">Link 1</a>
<a href="#">Link 2</a>
<a href="#">Link 3</a>
</div>
</div>
</ul>
<ul class="nav navbar-nav navbar-right">
<li><a href="#"><span class="glyphicon glyphicon-user" aria-hidden="true"></span> User</a></li>
<li><a href="#"><span class="glyphicon glyphicon-off" aria-hidden="true" <img title="Deslogar"/> </span>Sair</a></li>
</ul>
</div>
</nav>
</body>
</html>Carregando comentários...