คำถามติดแท็ก twitter-bootstrap

Bootstrap เป็นเฟรมเวิร์กเอนด์ที่ออกแบบมาเพื่อพัฒนาเว็บไซต์และแอพพลิเคชั่นบนเว็บ สำหรับคำถามที่เกี่ยวข้องกับเวอร์ชั่นของ Bootstrap ให้ใช้แท็กของเวอร์ชันเฉพาะจาก "twitter-bootstrap-2", "twitter-bootstrap-3" และ "bootstrap-4"

12
วิธีเนมสเปซ Twitter Bootstrap เพื่อให้สไตล์ไม่ขัดแย้งกัน
ฉันต้องการใช้ Twitter Bootstrap แต่เฉพาะในองค์ประกอบบางอย่างเท่านั้นดังนั้นฉันจึงต้องหาวิธีนำหน้าคลาส Twitter Bootstrap ทั้งหมดด้วยคำนำหน้าของฉันหรือใช้ส่วนผสมที่น้อยกว่า ฉันยังไม่มีประสบการณ์เกี่ยวกับเรื่องนี้ดังนั้นฉันจึงไม่ค่อยเข้าใจวิธีการทำเช่นนี้ นี่คือตัวอย่างของ HTML ที่ฉันพยายามจัดรูปแบบ: <div class="normal-styles"> <h1>dont style this with bootstrap</h1> <div class="bootstrap-styles"> <h1>use bootstrap</h1> </div> </div> ในตัวอย่างนี้ Twitter Bootstrap จะใช้รูปแบบปกติทั้งคู่h1แต่ฉันต้องการเลือกมากขึ้นเกี่ยวกับพื้นที่ที่ฉันใช้สไตล์ Twitter Bootstrap

2
tabindex =“ - 1” ใน bootstrap คืออะไร
เป็นสิ่งที่tabindexแอตทริบิวต์ใน Bootstrap 3? เอกสารของมันไม่ได้บอกอะไรเกี่ยวกับพวกเขาแม้ว่าพวกเขาจะใช้มันจริงในทุกรูปแบบ ฉันพบสิ่งนี้เกี่ยวกับการใช้งานเท่านั้นซึ่งไม่ได้พูดอะไรมาก คำแนะนำเครื่องมือสำหรับผู้ใช้แป้นพิมพ์และเทคโนโลยีอำนวยความสะดวก สำหรับผู้ใช้ที่ใช้แป้นพิมพ์และในผู้ใช้เทคโนโลยีอำนวยความสะดวกโดยเฉพาะคุณควรเพิ่มคำแนะนำเครื่องมือให้กับองค์ประกอบที่โฟกัสได้ของแป้นพิมพ์เช่นลิงก์การควบคุมแบบฟอร์มหรือองค์ประกอบใด ๆ ที่กำหนดโดยพลการที่มีแอตทริบิวต์ tabindex = "0" และฉันพบว่าฉันไม่สามารถกดescเพื่อซ่อนกิริยาถ้าtabindex-1แอตทริบิวต์ไม่ การปิด Modal หลังจากกดปุ่มesc(ด้วย tabindex) Modal ไม่ปิดหลังจากกดปุ่มesc(ไม่มี tabindex)

1
จัดเรียงแถวตารางใน Bootstrap [ปิด]
ปิด . คำถามนี้จะต้องมีมากขึ้นมุ่งเน้น ขณะนี้ยังไม่ยอมรับคำตอบ ต้องการปรับปรุงคำถามนี้หรือไม่ อัปเดตคำถามเพื่อให้เน้นไปที่ปัญหาเดียวโดยแก้ไขโพสต์นี้เท่านั้น ปิดให้บริการใน3 ปีที่ผ่านมา ปรับปรุงคำถามนี้ ใครช่วยแสดงตัวอย่างโค้ดที่ฉันต้องใช้เพื่อจัดเรียงคอลัมน์ของตารางใน Bootstrap ได้ไหม ตัวอย่างเช่นหากฉันต้องการจัดเรียงตามราคาหรือตามชื่อ

5
เหตุใด Twitter Bootstrap จึงใช้พิกเซลสำหรับขนาดตัวอักษร
เนื่องจาก Twitter Bootstrap ได้รับการออกแบบให้ตอบสนอง / เป็นมิตรกับอุปกรณ์เหตุใดจึงไม่ใช้ขนาดตัวอักษรที่สัมพันธ์กัน

18
Bootstrap เลือกตัวยึดรายการแบบเลื่อนลง
ฉันกำลังพยายามสร้างรายการแบบเลื่อนลงที่มีตัวยึด ดูเหมือนจะไม่รองรับplaceholder="stuff"เหมือนรูปแบบอื่น ๆ มีวิธีอื่นในการรับตัวยึดตำแหน่งในเมนูแบบเลื่อนลงของฉันหรือไม่

15
วิธีปรับขนาด Twitter Bootstrap modal แบบไดนามิกตามเนื้อหา
ฉันมีเนื้อหาฐานข้อมูลที่มีข้อมูลประเภทต่างๆเช่นวิดีโอ Youtube วิดีโอ Vimeo ข้อความรูปภาพ Imgur เป็นต้นทั้งหมดนี้มีความสูงและความกว้างที่แตกต่างกัน สิ่งที่ฉันพบขณะค้นหาอินเทอร์เน็ตกำลังเปลี่ยนขนาดเป็นพารามิเตอร์เดียว จะต้องเหมือนกับเนื้อหาในป๊อปอัป นี่คือรหัส HTML ของฉัน ฉันยังใช้ Ajax เพื่อเรียกเนื้อหา <div id="modal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> <h3 id="ModalLabel"></h3> </div> <div class="modal-body"> </div> </div>

4
bootstrap 4 ยูทิลิตี้ตอบสนองที่มองเห็น / ซ่อน xs sm lg ไม่ทำงาน
มีปัญหาเกี่ยวกับระบบสาธารณูปโภคที่ตอบสนองต่อใหม่ซ่อน / เรียนมองเห็นได้เมื่อการโยกย้ายไปยังBootstrap 4 ฉันทราบว่า. hidden- คลาสถูกลบออกจาก v3 แล้วและแทนที่ด้วย.hidden-*-up .hidden-*-down. ใช้.hidden-*-up.hidden-*-downคลาสใหม่แต่องค์ประกอบไม่เปลี่ยนเป็นมองเห็น / ซ่อน คิดไม่ออกว่าทำไม <div class="col hidden-xs-down"> <span class="vcard"> … </span> </div> <div class="col hidden-lg-down"> <div class="hidden-sm-down"> … </div> <div class="hidden-xs-down"> … </div> </div> * ไม่มีสิ่งใดซ่อนอยู่ในตัวอย่างนี้โดยไม่คำนึงถึงขนาดหน้าจอ (Safari, โหมดออกแบบตอบสนอง)

7
ขนาดคอลัมน์ตาราง
ในBootstrap 3ผมสามารถนำไปใช้col-sm-xxกับthแท็กในtheadและปรับขนาดคอลัมน์ของตารางที่จะ อย่างไรก็ตามสิ่งนี้ใช้ไม่ได้ใน bootstrap 4 ฉันจะบรรลุสิ่งนี้ใน bootstrap 4 ได้อย่างไร? <thead> <th class="col-sm-3">3 columns wide</th> <th class="col-sm-5">5 columns wide</th> <th class="col-sm-4">4 columns wide</th> </thead> ดูจาก codeply ที่มีขนาดไม่เหมาะสมโดยเฉพาะอย่างยิ่งถ้าคุณเพิ่มข้อมูลบางอย่างลงในตาราง ดูว่าสิ่งนี้ทำงานอย่างไร: <div class="container" style="border: 1px solid black;"> <table class="table table-bordered"> <thead> <tr class="row"> <th class="col-sm-3">3 columns wide</th> <th class="col-sm-5">5 columns wide</th> <th class="col-sm-4">4 columns …

14
ข้อความแจ้งเตือน Twitter Bootstrap ปิดแล้วเปิดอีกครั้ง
ฉันมีปัญหากับข้อความแจ้งเตือน มันแสดงขึ้นตามปกติและฉันสามารถปิดได้เมื่อผู้ใช้กดx(ปิด) แต่เมื่อผู้ใช้พยายามที่จะแสดงอีกครั้ง (เช่นคลิกที่เหตุการณ์ปุ่ม) มันจะไม่แสดง (ยิ่งไปกว่านั้นถ้าฉันพิมพ์ข้อความแจ้งเตือนนี้ไปที่คอนโซลมันจะเท่ากับ[]) รหัสของฉันอยู่ที่นี่: <div class="alert" style="display: none"> <a class="close" data-dismiss="alert">×</a> <strong>Warning!</strong> Best check yo self, you're not looking too good. </div> และเหตุการณ์: $(".alert").show(); ปล! ฉันต้องการแสดงข้อความแจ้งเตือนหลังจากเหตุการณ์บางอย่างเกิดขึ้นเท่านั้น (เช่นคลิกปุ่ม) หรือว่าฉันทำอะไรผิด?

1
เครื่องมือเลือกวันที่และเวลา Bootstrap [ปิด]
ตามที่กล่าวมาในปัจจุบันคำถามนี้ไม่เหมาะสำหรับรูปแบบถาม & ตอบของเรา เราคาดหวังว่าคำตอบจะได้รับการสนับสนุนจากข้อเท็จจริงการอ้างอิงหรือความเชี่ยวชาญ แต่คำถามนี้อาจก่อให้เกิดการถกเถียงโต้แย้งการสำรวจความคิดเห็นหรือการอภิปรายเพิ่มเติม หากคุณรู้สึกว่าคำถามนี้สามารถปรับปรุงได้และอาจเปิดใหม่ได้โปรดไปที่ศูนย์ช่วยเหลือเพื่อรับคำแนะนำ ปิดให้บริการใน8 ปีที่ผ่านมา แนะนำ JavaScript เพื่อเลือกวันที่และเวลา หมายเหตุ: ฉันต้องการใช้ไฟล์เดียวในการเลือกวันที่และเวลา ฉันเห็นสิ่งนี้แล้ว: http://www.eyecon.ro/bootstrap-datepicker/ และ http://jdewit.github.com/bootstrap-timepicker/index.html

8
การอัปเดต Bootstrap เป็นเวอร์ชัน 3 - ฉันต้องทำอย่างไร
ฉันเพิ่งเริ่มใช้ Bootstrap และมีเวอร์ชันเก่ากว่า 2.3.2 เวอร์ชัน 3 ได้รับการเผยแพร่แล้ว ฉันเพียงแค่แทนที่ไฟล์ CSS และ Javascript ถ้าฉันต้องการใช้เวอร์ชันล่าสุด

6
ตอบสนองต่อ iframe โดยใช้ Bootstrap
ฉันใช้ Bootstrap ฉันมีข้อความที่มีวิดีโอฝังตาม iframe 2 หรือ 3 รายการ ข้อมูลนี้ดึงมาจากฐานข้อมูล ฉันจะทำให้ iframe เหล่านี้ตอบสนองได้อย่างไร ตัวอย่างรหัส: <div class="row"> <div class="col-lg-12 col-md-12 col-sm-12"> SOME TEXT SOME TEXT SOME TEXT SOME TEXT SOME TEXT SOME TEXT SOME TEXT SOME TEXT <iframe src="http://youtube.com/...."></iframe> SOME TEXT SOME TEXT SOME TEXT SOME TEXT SOME TEXT SOME TEXT SOME …

19
ปิดใช้งานเวลาในตัวเลือกวันที่เวลาบูตสแตรป
ฉันใช้ตัวเลือกวันที่เวลาบูตสแตรปในเว็บแอปพลิเคชันของฉันซึ่งสร้างใน PHP / HTML5 และ JavaScript ฉันกำลังใช้งานจากที่นี่: http://tarruda.github.io/bootstrap-datetimepicker/ เมื่อฉันใช้การควบคุมโดยไม่มีเวลามันไม่ได้ผล มันแสดงกล่องข้อความเปล่า ฉันแค่ต้องการลบเวลาออกจากเครื่องมือเลือกวันที่ มีวิธีแก้ปัญหานี้หรือไม่? <div class="well"> <div id="datetimepicker4" class="input-append"> <input data-format="yyyy-MM-dd" type="text"></input> <span class="add-on"> <i data-time-icon="icon-time" data-date-icon="icon-calendar"> </i> </span> </div> </div> <script type="text/javascript"> $(function() { $('#datetimepicker4').datetimepicker({ pickTime: false }); }); </script>

14
จัดหน้าให้อยู่กึ่งกลางใน bootstrap
ฉันมีรหัสนี้อยู่ในเลขหน้า <div class="pagination"> <ul> <li><a href="?p=0" data-original-title="" title="">1</a></li> <li><a href="?p=1" data-original-title="" title="">2</a></li> </ul> </div> แต่ของฉันulอยู่ชิดซ้าย มีวิธีใดบ้างที่จะทำให้ulWRT อยู่ตรงกลางdiv? ฉันพยายามmargin: auto autoและmargin :0 autoพวกเขา แต่ไม่ได้ผล

30
Bootstrap Modals ยังคงเพิ่มช่องว่างภายในให้กับร่างกายหลังจากปิดแล้ว
ฉันใช้ bootstrap และ Parse framework เพื่อสร้าง webapp ขนาดเล็ก แต่วิธีการ Bootstrap เหล่านั้นยังคงเพิ่มช่องว่างภายในให้กับร่างกายหลังจากปิดแล้ว วิธีแก้ปัญหานี้? ฉันพยายามใส่รหัสนี้ในจาวาสคริปต์ของฉัน: $('.modal').on('hide.bs.modal', function (e) { $("element.style").css("padding-right","0"); }); แต่มันไม่ได้ผล ไม่มีใครรู้วิธีแก้ไขปัญหานี้หรือไม่? รหัสของฉัน: <button type="button" class="btn btn-lg btn-default" data-toggle="modal" data-target="#loginModal">Admin panel</button> <div id="loginModal" class="modal fade" role="dialog"> <div class="modal-dialog modal-sm"> <!-- Modal content --> <div class="modal-content"> <!-- header --> <div class="modal-header"> <button …

โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.