下拉菜单 向右对齐
Bootstrap下拉菜单 向右对齐
通过向 .dropdown-menu 添加 class .pull-right 来向右对齐下拉菜单。下面的实例演示了这点：
Bootstrap默认情况下，下拉菜单自动沿着父元素的上沿和左侧被定位为 100% 宽度。 为 .dropdown-menu 添加 .dropdown-menu-right 类可以让菜单右对齐。
可能需要额外的定位May require additional positioning
在正常的文档流中，通过 CSS 为下拉菜单进行定位。这就意味着下拉菜单可能会由于设置了 overflow 属性的父元素而被部分遮挡或超出视口（viewport）的显示范围。如果出现这种问题，请自行解决。
- 看，我在右边
- Bootstrap下拉菜单A 我在右边
- Bootstrap下拉菜单B 我在右边
- Bootstrap下拉菜单C 我在右边
<div class="dropdown"> <button type="button" class="btn dropdown-toggle" id="dropdownMenu1" data-toggle="dropdown">Bootstrap下拉菜单 向右对齐实例 <span class="caret"> </span> </button> <ul class="dropdown-menu pull-right" role="menu" aria-labelledby="dropdownMenu1"> <li role="presentation"> <a role="menuitem" tabindex="-1" href="#">看，我在右边</a> </li> <li role="presentation"> <a role="menuitem" tabindex="-1" href="#">Bootstrap下拉菜单A 我在右边</a> </li> <li role="presentation"> <a role="menuitem" tabindex="-1" href="#">Bootstrap下拉菜单B 我在右边</a> </li> <li role="presentation" class="divider"></li> <li role="presentation"> <a role="menuitem" tabindex="-1" href="#">Bootstrap下拉菜单C 我在右边</a> </li> </ul> </div>
从 v3.1.0 版本开始,不建议使用 .pull-right
从 v3.1.0 版本开始，我们不再建议对下拉菜单使用 .pull-right 类。如需将菜单右对齐，请使用 .dropdown-menu-right 类。导航条中如需添加右对齐的导航（nav）组件，请使用 .pull-right 的 mixin 版本，可以自动对齐菜单。如需左对齐，请使用 .dropdown-menu-left 类。
<ul class="dropdown-menu dropdown-menu-right" role="menu" aria-labelledby="dLabel"> ... </ul> 正文到此结束
热门推荐
相关文章
近期评论
-
文章和留言都翻到11页了 没有OOM
-
-
朋友，翻页到11页，及以后，会出现OOM，无法访问
-
-
搞个gitee的项目
-
-
版本号是多少，你可以下载哪个代码仓库，jdk选1.8 直接跑就行
-
-
-
Loading...
![[HBLOG]公众号](https://www.liuhaihua.cn/img/qrcode_gzh.jpg)
