亚洲国产日韩欧美一区二区三区,精品亚洲国产成人av在线,国产99视频精品免视看7,99国产精品久久久久久久成人热,欧美日韩亚洲国产综合乱

<p> Ich habe meine Navigationsleiste auf dem PC vervollst?ndigt und den Code für die Anzeige im Quer- und Hochformat auf meinem iPhone geteilt. Im Querformat l?uft die Navigationsleiste nach rechts über. <em>env(safe-area-inset)</em>-Wert für nicht blockierende Zweckansichten hinzugefügt, l?uft aber rechts über. Kann das Problem scheinbar nicht finden. </p> <p>iPhone (11 Pro Max) Querformat Die linke Lücke ist der sichere Bereich env(), aber die rechte Lücke im sicheren Bereich wird von der Navigationsleiste überfüllt.</p> <p>下面是代碼：</p> <p> <pre class="brush:css;toolbar:false;">@import url("https://fonts.googleapis.com/css2?family=Montserrat:ital@1&display=swap"); * { Boxgr??e: border-box; Polsterung: 0; Rand: 0; Listenstil: keiner; Textdekoration: keine; Schriftfamilie: ?Montserrat“, serifenlos; Textausrichtung: Mitte; } K?rper { Hintergrund: wei?; padding-left: env(safe-area-inset-left); padding-right: env(safe-area-inset-right); padding-top: env(safe-area-inset-top); } .nav-bar { Anzeige: Flex; justify-content: Leerzeichen dazwischen; Polsterung: 0 2rem; H?he: 50px; align-items: center; Hintergrund: #0f0f0f; Farbe: #fff; Position: fest; oben: 0; Breite: 100 %; Z-Index: 999; } .Hamburger { Anzeige: keine; } .hamburger i { Farbe wei?; Schriftgr??e: 25px; Polsterung: 5px 7px; Randradius: 5px; } .hamburger i:hover { Farbe wei?; Hintergrund: rgb(69, 69, 69); } .nav-bar .nav-items { Anzeige: Flex; Rand oben: 4px; align-items: center; } .nav-bar .nav-items li a { Benutzerauswahl: keine; Schriftdicke: fett; Bildschirmsperre; Farbe wei?; Schriftgr??e: 20px; Polsterung: 4px 10px; übergang: 150ms; -Webkit-übergang: 150 ms; -moz-übergang: 150 ms; Rand: 0 10px; } .nav-bar .nav-items li a:after { Bildschirmsperre; Inhalt: ""; border-top: 2px solid rgb(140, 73, 255); transform: scaleX(0); -webkit-transform: scaleX(0); -moz-transform: scaleX(0); übergang: Transformation 150 ms Ease-in-out; -webkit-transition: 150 ms Easy-In-Out transformieren; -moz-transition: 150 ms Ease-In-Out transformieren; } .nav-bar .nav-items li a:hover:after, .nav-bar .nav-items li a.active:after { transform: scaleX(1); -webkit-transform: scaleX(1); -moz-transform: scaleX(1); } .nav-bar .nav-items li a:hover { Filter: Helligkeit (85 %); -Webkit-Filter: Helligkeit (85 %); } .nav-bar .login-register { Anzeige: Flex; Flexrichtung: Reihe; } .nav-bar .login-register .button { Benutzerauswahl: keine; Rand unten: 4px; Farbe: #fff; Schriftgr??e: 20px; Rand: 2 Pixel einfarbiges RGB (116, 36, 255); Polsterung: 4px 20px; Randradius: 4px; -webkit-Grenzradius: 4px; -moz-border-radius: 4px; übergang: alle Ease in 0,2 s; -webkit-transition: alle Ease-in 0,2 s; -moz-transition: alle Ease-in 0,2 s; } .nav-bar .login-register .button:hover { Hintergrund: RGB(116, 36, 255); } /*funktioniert einwandfrei | kleine Aufl?sung für Mobilger?te*/ Nur @media-Bildschirm und (maximale Breite: 850 Pixel) { .Hamburger { H?he: automatisch; Bildschirmsperre; Cursor: Zeiger; } .hamburger i { Breite: 35px; H?he: 35px; Hintergrund: #0f0f0f; }.nav-bar .nav-items { Flexrichtung: Spalte; Position: fest; Breite: 20vw; Hintergrund: #383838; Polsterung: 1,5rem 0; H?he: 280px; oben: 46px; Z-Index: 99; rechts: -100 %; übergang: 0,2 s Einschwingzeit; -webkit-transition: 0,2 Sekunden Einlaufzeit; -moz-transition: 0,2 s Einlaufzeit; } .nav-bar .nav-items li a { Schriftgr??e: 20px; Polsterung: 0 10px; Rand: 10px 0; } .nav-bar .nav-items.active { rechts: 0; } }</pre> <pre class="brush:html;toolbar:false;"><link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.3.0/ css/all.min.css"> <navbar class="nav-bar"> <div class="logo" onclick="window.location.href='Home.html'">TEST-LOGO</div> <div class="hamburger" for="check"> <i class="fa-solid fa-bars"></i> </div> <ul class="nav-items"> <li> <a href="#" class="active">Home</a> </li> <li> <a href="#">Erkunden</a> </li> <li> <a href="#">Shop</a> </li> <li> <a href="#">über</a> </li> <div class="login-register"> <a href="#" class="button">Anmelden</a> </div> </ul> </navbar></pre> </p> <p> 屬性.所有這些都會導(dǎo)致導(dǎo)航欄中的內(nèi)容發(fā)生位移或尺寸錯誤.</p>