-
<div class="btn-group"> <button class="btnbtn-default" type="button">首页</button> <button class="btnbtn-default" type="button">产品展示</button> <button class="btnbtn-default" type="button">案例分析</button> <button class="btnbtn-default" type="button">联系我们</button> <div class="btn-group"> <button class="btnbtn-default dropdown-toggle" data-toggle="dropdown" type="button">关于我们<span class="caret"></span></button> <ul class="dropdown-menu"> <li><a href="##">公司简介</a></li> <li><a href="##">企业文化</a></li> <li><a href="##">组织结构</a></li> <li><a href="##">客服服务</a></li> </ul> </div> </div>查看全部
-
<div class="btn-toolbar"> <div class="btn-group btn-group-lg"> … </div> <div class="btn-group"> … </div> <div class="btn-group btn-group-sm"> … </div> <div class="btn-group btn-group-xs"> … </div> </div>查看全部
-
在介绍按钮一节中，我们知道按钮是通过btn-lg、btn-sm和btn-xs三个类名来调整padding、font-size、line-height和border-radius属性值来改变按钮大小。那么按钮组的大小，我们也可以通过类似的方法： .btn-group-lg:大按钮组 .btn-group-sm:小按钮组 .btn-group-xs:超小按钮组查看全部
-
从效果图上我们可以看出，按钮组四个角都是圆角（支持CSS3的浏览器），但有的小伙伴会问，我们平常制作网页时每个按钮都是带有圆角，而在按钮组中的按钮，除了第一个和最后一个具有边上的圆角之外，其他的按钮没有圆角，它是怎么实现的呢？其实实现方法非常简单： 1、默认所有按钮都有圆角 2、除第一个按钮和最后一个按钮（下拉按钮除外），其他的按钮都取消圆角效果 3、第一个按钮只留左上角和左下角是圆角 4、最后一个按钮只留右上角和右下角是圆角查看全部
-
唯一不同的是外部容器“div.dropdown”换成了“div.btn-group”。查看全部
-
在制作等分按钮组时，只需要在按钮组“btn-group”上追加一个“btn-group-justified”类名。尽量使用<a>标签元素来制作按钮，因为使用<button>标签元素时，使用display:table在部分浏览器下支持并不友好。查看全部
-
<script src='https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js'></script> <script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>查看全部
-
水平分组按钮第一个按钮左上角和左下角具有圆角以及最后一个按钮右上角和右下角具有圆角 垂直分组按钮第一个按钮左上角和右上角具有圆角以及最后一个按钮左下角和右下角具有圆角 最外层把水平分组的“btn-group”类名换成“btn-group-vertical”即可查看全部
-
<div class="btn-group btn-group-sm"><btton>.....</button></div> .btn-group-lg:大按钮组 .btn-group-sm:小按钮组 .btn-group-xs:超小按钮组 将按钮组“btn-group”按组放在一个大的容器“btn-toolbar”中查看全部
-
当前状态（.active）和禁用状态（.disabled）。这两种状态使用方法只需要在对应的li添加对应的类名。 下拉菜单项的默认的状态（不用设置）有悬浮状态（:hover）和焦点状态（:focus）： .dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus { color: #262626; text-decoration: none; background-color: #f5f5f5; }查看全部
-
<ul class="dropdown-menu pull-right" role="menu" aria-labelledby="dropdownMenu1"> 下拉菜单相对于父容器右对齐时，可以在“dropdown-menu”上添加一个“pull-right”或者“dropdown-menu-right”类名。同时一定要为.dropdown添加float:left样式。 与“dropdown-menu-right”相反的类名“dropdown-menu-left”，其效果就是让下拉菜单与父容器左边对齐，其实就是默认效果。查看全部
-
<li role="presentation" class="divider"></li> <li role="presentation" class="dropdown-header">第二部分菜单头部</li> dropdown-header 菜单头部查看全部
-
<li role="presentation" class="divider"></li> 下拉分割线查看全部
-
文本域<textarea>也是表单的控件之一，因此也要加在form-group的块中，并且一定要添加form-control类名，以保证风格一致查看全部
-
表单中的所有控件都需要加form-control类名，才能保证风格一致。而且<input>标签必须指定type查看全部
举报
0/150
提交
取消