Ir para conteúdo
Fórum Script Brasil
  • 0

Menu horizontal


adrsublimacao

Pergunta

2 respostass a esta questão

Posts Recomendados

  • 0

Consegui copiar quase tudo, mas o meu melhor trabalho está na gambiarra que eu fiz na caixa de busca:

navbar.php

<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha3/dist/css/bootstrap.min.css"
 rel="stylesheet" 
 integrity="sha384-KK94CHFLLe+nY2dmCWGMq91rCGa5gtU4mk92HdvYe+M/SXH301p5ILy+dN9+nJOZ" 
 crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha3/dist/js/bootstrap.bundle.min.js"
 integrity="sha384-ENjdO4Dr2bkBIFxQpeoTz1HIcje39Wm4jDKdf19U8gI4ddQ3GYNS7NTKfAdVQSZe" 
 crossorigin="anonymous"></script>
<nav class="navbar navbar-expand-lg navbar-light bg-light">
<nav class="navbar navbar-expand-lg bg-body-tertiary">
<div class="container-fluid">
<a class="navbar-brand" href="#"><img src=https://logopng.com.br/logos/ifood-43.png width=80 height=40></a>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
<li class="nav-item">
<a id=inicio class="nav-link" aria-current="page" href="inicio">Inicio</a></li>
<li class="nav-item">
<a id=restaurante class="nav-link active" aria-current="page" href="restaurante">Restaurantes</a>
</li>
<li class="nav-item">
<a id=mercado class="nav-link" aria-current="page" href="produto">Mercados</a></li>

<form class="d-flex" role="search">
<i class="input-group-text">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="currentColor" class="bi bi-search" viewBox="0 0 16 16">
<path d="M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001c.03.04.062.078.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1.007 1.007 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0z"/>
</svg><input class="border-0 bg-transparent" placeholder="Busque por item ou loja" style=outline:none></i></form>

<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">
Contagem - MG
</a>
<ul class="dropdown-menu">
<li><a class="dropdown-item" href="#">Action</a></li>
<li><a class="dropdown-item" href="#">Another action</a></li>
<li><hr class="dropdown-divider"></li>
<li><a class="dropdown-item" href="#">Something else here</a></li>
</ul></li>

<li class="nav-item"><a class="nav-link" href="#">Link</a></li>
<li class="nav-item"><a class="nav-link" href="#">Link</a></li>
</ul></div></div></nav></nav>
-------------------------------------------------------------------------------
produto.php

<?php
include('navbar.php');
echo "<div style='width:500;margin:0 auto;margin-top:50'>";
echo "Beringela <br>";
echo "Abacaxi <br>";
echo "</div>";
?>
<script>
	inicio.className="nav-link"
	restaurante.className="nav-link"
	mercado.className="nav-link active"
</script>
-------------------------------------------------------------------------------
inicio.php

<?php
include('navbar.php');
echo "<div style='width:500;margin:0 auto;margin-top:50'>";
echo "Aqui é o <br>";
echo "começo de tudo <br>";
echo "</div>";
?>
<script>
	inicio.className="nav-link text-danger"
	restaurante.className="nav-link"
	mercado.className="nav-link"
</script>

-------------------------------------------------------------------------------

restaurante.php

<?php
include('navbar.php');
echo "<div style='width:500;margin:0 auto;margin-top:50'>";
echo "Bar do Zé <br>";
echo "Bar da Esquina <br>";
echo "</div>";
?>
<script>
	inicio.className="nav-link"
	restaurante.className="nav-link text-danger"
	mercado.className="nav-link"
</script>

  

 

Editado por Frank K Hosaka
Link para o comentário
Compartilhar em outros sites

Participe da discussão

Você pode postar agora e se registrar depois. Se você já tem uma conta, acesse agora para postar com sua conta.

Visitante
Responder esta pergunta...

×   Você colou conteúdo com formatação.   Remover formatação

  Apenas 75 emoticons são permitidos.

×   Seu link foi incorporado automaticamente.   Exibir como um link em vez disso

×   Seu conteúdo anterior foi restaurado.   Limpar Editor

×   Você não pode colar imagens diretamente. Carregar ou inserir imagens do URL.



  • Estatísticas dos Fóruns

    • Tópicos
      152,3k
    • Posts
      652,4k
×
×
  • Criar Novo...