Questions tagged «twitter-bootstrap-4»

6
`col-xs- *`在Bootstrap 4中不起作用
我以前从未遇到过,而且我很难找到解决方案。当在引导程序中具有等于medium的列时,如下所示: <h1 class="text-center">Hello, world!</h1> <div class="container"> <div class="row"> <div class="col-md-12 text-center"> <h1>vicki williams</h1> </div> </div> </div> 文本对齐可以正常工作: 但是当使列等于超小时,如下所示: <div class="container"> <div class="row"> <div class="col-xs-12 text-center"> <h1>vicki williams</h1> </div> </div> </div> 然后,文本对齐将不再起作用: 是否有一些我不理解的引导概念,或者这实际上是我认为是错误的。我从来没有遇到过这个问题,因为我的文字在过去一直与xs对齐。任何帮助将不胜感激。这是我完整的代码: <!DOCTYPE html> <html lang="en"> <head> <!-- Required meta tags --> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <!-- …



12
如何在Bootstrap 4的下拉菜单中删除箭头?
我正在使用Bootstrap4。我试图删除下拉菜单中的箭头。 我为Bootstrap 3找到的答案不再起作用。 jsfiddle在这里。 <div class="dropdown open"> <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> Dropdown </button> <div class="dropdown-menu" aria-labelledby="dropdownMenu1"> <a class="dropdown-item" href="#">Action</a> <a class="dropdown-item" href="#">Another action</a> </div> </div>

9
如何在单击时隐藏可折叠的Bootstrap 4导航栏
我已经使用Bootstrap 4创建了可折叠的导航栏,该导航栏效果很好,但是我希望在用户单击链接时将其关闭。有什么办法吗?谢谢 html导航栏: <nav class="navbar navbar-toggleable-md fixed-top"> <button id="nav-btn"class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarDiv" aria-expanded="false" aria-label="Toggle navigation"> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <div class="container"> <a class="navbar-brand" href="#"><img src="Images/logo.png" width="60px"></a> <div class="collapse navbar-collapse" id="navbarDiv"> <ul class="navbar-nav mr-auto"> <li class="nav-item active"> <a class="nav-link" href="#home">Home <span class="sr-only">(current)</span></a> </li> <li class="nav-item"> <a class="nav-link" …


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,响应式设计模式)都不会隐藏任何内容

9
Bootstrap 4中的左右对齐模式页脚按钮
Bootstrap 4将flex-box用于其模态页脚。如果我需要两个按钮,一个在左边,一个在右边,如何使其正常工作? 下面的代码尝试使用div.rowwith,col-sm-6但不起作用。 <script src="https://code.jquery.com/jquery-3.1.1.slim.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/tether/1.4.0/js/tether.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/js/bootstrap.min.js"></script> <link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css" rel="stylesheet"/> <!-- Button trigger modal --> <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#myModal"> Launch demo modal </button> <!-- Modal --> <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true"> <div class="modal-dialog" role="document"> <div class="modal-content"> <div class="modal-header"> <h5 class="modal-title" id="exampleModalLabel">Modal title</h5> <button …

By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.