คำถามติดแท็ก navbar

ส่วนของ HTML และ XML ที่เกี่ยวข้องโดยตรงกับการนำทางหน้า


10
Bootstrap NavBar ที่มีรายการตรงกลางซ้ายหรือขวา
ในBootstrapวิธีที่เป็นมิตรกับแพลตฟอร์มที่สุดในการสร้างแถบการนำทางที่มีโลโก้ A อยู่ทางซ้ายรายการเมนูที่อยู่ตรงกลางและโลโก้ B ทางด้านขวา นี่คือสิ่งที่ฉันได้ลองมาแล้วและมันก็อยู่ในแนวเดียวกันเพื่อให้โลโก้ A อยู่ทางซ้ายรายการเมนูถัดจากโลโก้ด้านซ้ายและโลโก้ B ทางด้านขวา <div class="navbar navbar-fixed-top navbar-custom "> <div class="container" > <div class="navbar-header"> <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <a class="navbar-brand" href="#"><span class="navbar-logo">Logo_A</span></a> </div> <div class="collapse navbar-collapse"> <ul class="nav navbar-nav"> <li class="active"><a href="#">Home</a></li> <li><a href="#about">Menu Item 1</a></li> …

29
Bootstrap 3 Navbar พร้อมโลโก้
ฉันต้องการใช้ Navbar เริ่มต้น Bootstrap 3 พร้อมโลโก้รูปภาพแทนการสร้างแบรนด์ข้อความ วิธีที่เหมาะสมในการทำเช่นนี้คืออะไรโดยไม่ทำให้เกิดปัญหากับขนาดหน้าจอที่แตกต่างกัน ฉันถือว่านี่เป็นข้อกำหนดทั่วไป แต่ฉันยังไม่เห็นตัวอย่างโค้ดที่ดี ข้อกำหนดสำคัญอื่น ๆ นอกเหนือจากการแสดงผลที่ยอมรับได้ในทุกขนาดหน้าจอคือการยุบเมนูบนหน้าจอขนาดเล็ก ฉันพยายามใส่แท็ก IMG ไว้ในแท็ก A ที่มีระดับแบรนด์ navbar แต่นั่นทำให้เมนูไม่สามารถทำงานได้อย่างถูกต้องบนโทรศัพท์ Android ของฉัน ฉันยังพยายามเพิ่มความสูงของคลาส navbar แต่นั่นทำให้สิ่งต่าง ๆ แย่ลงไปอีก อย่างไรก็ตามรูปโลโก้ของฉันมีขนาดใหญ่กว่าความสูงของแถบนำทาง

21
Bootstrap 4 จัดตำแหน่งรายการ navbar ทางด้านขวา
ฉันจะจัดตำแหน่งรายการ navbar ให้ถูกต้องได้อย่างไร? ฉันต้องการเข้าสู่ระบบและลงทะเบียนทางด้านขวา แต่ทุกสิ่งที่ฉันลองดูเหมือนจะไม่ทำงาน นี่คือสิ่งที่ฉันได้ลองไปแล้ว: <div>รอบ ๆ<ul>ด้วยแอททริบิวต์:style="float: right" <div>รอบ ๆ<ul>ด้วยแอททริบิวต์:style="text-align: right" ลองสองสิ่งเหล่านี้บน<li>แท็ก ลองทุกสิ่งเหล่านั้นอีกครั้งโดย!importantเพิ่มไปยังจุดสิ้นสุด เปลี่ยนnav-itemเป็นnav-rightใน<li> เพิ่มpull-sm-rightคลาสให้กับ<li> เพิ่มalign-content-endคลาสให้กับ<li> นี่คือรหัสของฉัน: <div id="app" class="container"> <nav class="navbar navbar-toggleable-md navbar-light bg-faded"> <button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> <a class="navbar-brand" href="#">Navbar</a> <ul class="navbar-nav"> <li class="nav-item active"> <a class="nav-link" href="#">Home …

26
วิธีการตั้งค่าคลาสแอ็คทีฟ bootstrap navbar ด้วย Angular JS
หากฉันมี navbar ใน bootstrap กับรายการ Home | About | Contact ฉันจะตั้งค่าคลาสที่แอ็คทีฟสำหรับแต่ละไอเท็มเมนูได้อย่างไรเมื่อแอ็คทีฟ? นั่นคือฉันจะตั้งได้อย่างไรclass="active"เมื่อเส้นทางเชิงมุมอยู่ที่ #/ สำหรับบ้าน #/about สำหรับหน้าเกี่ยวกับ #/contact สำหรับหน้าติดต่อ

11
จัดกึ่งกลางเนื้อหาในแถบนำทาง bootstrap ที่ตอบสนองต่อ
ฉันมีปัญหาในการศูนย์กลางเนื้อหาของฉันในแถบนำทาง bootstrap ฉันใช้ bootstrap 3. ฉันได้อ่านบทความจำนวนมาก แต่ CSS หรือวิธีการที่ใช้จะไม่ทำงานกับรหัสของฉัน! ฉันผิดหวังจริงๆดังนั้นนี่เป็นตัวเลือกสุดท้ายของฉัน ความช่วยเหลือใด ๆ ที่จะได้รับการชื่นชม! <!DOCTYPE html> <html> <head> <title>Navigation</title> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <!-- Bootstrap --> <link href="css/bootstrap.min.css" rel="stylesheet" media="screen"> <link href="css/style.css" rel="stylesheet" media="screen"> </head> <body> <div class="container"> <nav class="navbar navbar-default" role="navigation"> <!-- Brand and toggle get grouped for better mobile …

18
เปลี่ยนจุดพักการยุบ navbar ของ bootbar โดยไม่ใช้ LESS
ปัจจุบันเมื่อความกว้างของเบราว์เซอร์ลดลงต่ำกว่า 768px แถบนำทางจะเปลี่ยนเป็นโหมดยุบตัว ฉันต้องการเปลี่ยนความกว้างนี้เป็น 1,000px ดังนั้นเมื่อเบราว์เซอร์ต่ำกว่า 1,000px แถบนำทางจะเปลี่ยนเป็นโหมดยุบ ฉันต้องการทำสิ่งนี้โดยไม่ใช้ LESS ฉันใช้สไตลัสไม่ใช่ LESS ปัญหาของฉันเหมือนกับคำถามนี้: Bootstrap 3 Navbar ยุบ แต่คำตอบทั้งหมดในคำถามนั้นจะอธิบายวิธีการทำโดยการเปลี่ยนตัวแปร LESS ฉันไม่ได้ติดต่อกับน้อยฉันใช้สไตลัสดังนั้นฉันต้องการทราบว่าวิธีนี้สามารถทำได้โดยใช้สไตลัสหรือวิธีอื่น ขอบคุณ!

12
Bootstrap 3 Navbar ยุบ
มีวิธีใดที่จะเพิ่มจุดที่ bootstrap navbar 3 ยุบ (เช่นเพื่อให้มันยุบลงในแบบหล่นลงบนแท็บเล็ตแนวตั้ง)? สองสิ่งนี้ใช้ได้กับ bootstrap 2 แต่ไม่ใช่ตอนนี้! จะเปลี่ยนเกณฑ์การยุบ navbar โดยใช้ Twitter bootstrap-responsive ได้อย่างไร เปลี่ยนจุดพักการตอบสนอง navbar ดีฟอลต์

13
สี navbar ใน Twitter Bootstrap
ฉันจะเปลี่ยนสีพื้นหลังของแถบนำทางของ Twitter Bootstrap 2.0.2 ได้อย่างไร ฉันจะเปลี่ยนสีขององค์ประกอบทั้งหมดของแถบนำทางเพื่อสะท้อนสีพื้นหลังได้อย่างไร

9
จะใช้ปลั๊กอิน Affix ใหม่ใน bootstrap 2.1.0 ของ Twitter ได้อย่างไร
เอกสาร bootstrap ในหัวข้อนั้นทำให้ฉันสับสนเล็กน้อย ฉันต้องการให้เกิดลักษณะการทำงานที่คล้ายกันเช่นในเอกสารที่มีแถบนำทางที่ติดอยู่: แถบนำทางอยู่ด้านล่างส่วนหัวของย่อหน้า / หน้าและเมื่อเลื่อนลงมาควรเลื่อนไปก่อนจนกว่าจะถึงด้านบนสุดของหน้าจากนั้นติดที่นั่นเพื่อแก้ไขเพื่อเลื่อนลงต่อไป . เนื่องจาก jsFiddle ไม่ทำงานกับแนวคิด navbar ฉันจึงได้ตั้งค่าหน้าแยกสำหรับการใช้งานเป็นตัวอย่างขั้นต่ำ: http://i08fs1.ira.uka.de/~s_drr/navbar.html ฉันใช้สิ่งนี้เป็นแถบนำทางของฉัน: <div class="navbar affix-top" data-spy="affix" data-offset-top="50"> <div class="navbar-inner"> <div class="container"> <div class="span12"> <a class="brand" href="#">My Brand</a> This is my navbar. </div> </div> <!-- container --> </div> <!-- navbar-inner --> </div> <!-- navbar --> ฉันคิดว่าฉันต้องการdata-offset-topให้มีค่าเป็น 0 (เนื่องจากแถบควร …

9
การลดความสูงของ bootstrap 3.0 navbar
ฉันกำลังพยายามลดความสูงของ navbar bootstrap 3.0 ซึ่งใช้กับพฤติกรรมคงที่ นี่ฉันกำลังใช้รหัส HTML <div class="tnav"> <div class="navbar navbar-fixed-top" role="banner"> <div class="navbar-inner-sm"> <div class="container"> <div class="navbar-header"> <button class="navbar-toggle" type="button" data-toggle="collapse" data-target=".bs-navbar-collapse"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> </div> <nav class="collapse navbar-collapse" role="navigation"> <ul class="nav navbar-nav pull-right"> <li class="active"> <a href="../getting-started">Getting started</a> </li> <li> …

6
Bootstrap 3 - ปิดใช้งานการยุบแถบนำทาง
นี่คือแถบนำทางง่ายๆของฉัน: <div class="navbar navbar-fixed-top myfont" role="navigation"> <div class=""> <ul class="nav navbar-nav navbar-left"> <li> <a class="navbar-brand" href="#"> <img src="assets/img/logo.png"/> </a> </li> <li> <button class="btn btn-navbar"> <i class="fa fa-edit"></i> Create </button> </li> </ul> </div> <ul class="nav navbar-nav navbar-right"> <li data-match-route="/"><a href="#/page-one">Login</a></li> <li data-match-route="/"><a href="#/page-two/sub-a">Signup</a></li> </ul> </div> ฉันแค่อยากจะป้องกันไม่ให้สิ่งนี้ล่มสลายเพราะฉันไม่ต้องการมันทำอย่างไร? ฉันต้องการหลีกเลี่ยงการเขียน CSS 300K บรรทัดเพื่อลบล้างสไตล์เริ่มต้น ข้อเสนอแนะใด …
โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.