Ma barre NAV apparaît actuellement comme si j'inspise et mettez-la à un périphérique mobile tel que iPhone X: 
Cependant, je veux que cela apparaisse comme ça quand dans Mobile: 
p>
... et pour que la barre s'ouvre tel que lorsque le bouton est cliqué sur le bouton. P>
Pour le faire ressembler à je veux, j'utilise P> Affichage: Aucun code> dans CSS, mais cela signifie alors que cela signifie que Vous cliquez sur le bouton pour l'afficher que rien n'apparaît. Mon HTML et CSS sont les suivants: P>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<meta name="author" content="Lewis Haddon">
<title>Business website</title>
<link rel="stylesheet" href="./css/test2.css" type="text/css">
</head>
<body>
<nav>
<div class="logo">
<h4>The Nav</h4>
</div>
<ul class="nav-links">
<li><a href="">Home</a></li>
<li><a href="">S3</a></li>
<li><a href="">RS6</a></li>
</ul>
<div class="burger">
<div class="line1"></div>
<div class="line2"></div>
<div class="line3"></div>
</div>
</nav>
<script src="app.js"></script>
</body>
</html>
3 Réponses :
Utiliser Vous pouvez utiliser la requête Visibilité: masqué; comme CSS. @media pour détecter si le client est utilisé dans un environnement mobile.
Tout fait disparaître sur la ligne supérieure
Ajoutez ce code dans votre CSS, vous pouvez modifier le pixel de 320 à 350 ou 300 pour la vue mobile
On dirait toujours la même chose lorsque j'inspise la page sur Chrome et modifier le périphérique sur tous les différents iPhone, Google Pixel, etc. Le bar est toujours à droite avec un espace supérieur
Essayez après avoir effacé votre cache, ajoutez également un identifiant à votre
gyazo.com/c0e831df3eb6227a81df37283b581df37283b581d0065 J'ai changé de NAV-actif vers spectacle et NAV normale est sur Aucun donc il n'apparaît que J'appuie sur le bouton puis ressemble à la capture d'écran Toutefois, lorsque cela ne serait pas indiqué avant de cliquer, il ressemble à ce gyazo.com/51A3304Cec91ABAAD7C999525399B125
quand je viens de faire une fenêtre de taille manuelle sur mon bureau, cela fonctionne comme il le devrait juste quand je dois inspecter et dispositif que le problème apparaît
Utilisez ceci pour Toggler à droite:
p>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.11.2/css/all.min.css">
<link rel="stylesheet" href="style.css">
<title>Title</title>
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-light bg-light">
<a class="navbar-brand" href="#">Navbar</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarTogglerDemo02" aria-controls="navbarTogglerDemo02" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarTogglerDemo02">
<ul class="navbar-nav mr-auto mt-2 mt-lg-0">
<li class="nav-item active">
<a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Link</a>
</li>
<li class="nav-item">
<a class="nav-link disabled" href="#" tabindex="-1" aria-disabled="true">Disabled</a>
</li>
</ul>
</div>
</nav>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.slim.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.15.0/umd/popper.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script>
</body>
</html>amorcer?? qu'est-ce que je mets où l'étoile étoile est que je n'ai pas utilisé bootstrap
@ Tester54321 essayer maintenant
Ce n'est pas la même chose que je veux que le mien vient du côté droit
@ Tester54321User cela en collaboration avec votre jQuery via la balise de script dans la section du corps et dans Youo HTML
Je suis nouveau dans HTML et CSS et ne savez pas vraiment comment prendre des bits de cela pour réparer le mien si cela a du sens, je vois que cela tombe la barre du sommet, mais je veux que cela vienne du côté