-
存在bug及解决方法: 从运行效果中大家不难发现，页面主内容顶部和底部都被固定导航条给遮住了。为了避免固定导航条遮盖内容，我们需要在body上做一些处理：查看全部
-
固定导航条 很多情况之一，设计师希望导航条固定在浏览器顶部或底部，这种固定式导航条的应用在移动端开发中更为常见。Bootstrap框架提供了两种固定导航条的方式：查看全部
-
导航条基础 导航条（navbar）和上一节介绍的导航（nav），就相差一个字，多了一个“条”字。其实在Bootstrap框架中他们还是明显的区别。在导航条(navbar)中有一个背景色、而且导航条可以是纯链接（类似导航），也可以是表单，还有就是表单和导航一起结合等多种形式。在这一节中将一起探讨Bootstrap框架中导航条的使用。查看全部
-
导航（基础样式） 导航对于一位前端人员来说并不陌生。可以说导航是一个网站重要的元素组件之一，可以便于用户查找网站所提供的各项功能服务。导航的制作方法也是千奇百怪，五花八门。在这一节中将向大家介绍如何使用Bootstrap框架制作各式各样的导航。查看全部
-
单个按钮在Web页面中的运用有时候并不能满足我们的业务需求，常常会看到将多个按钮组合在一起使用，比如富文本编辑器里的一组小图标按钮等。那么在这一节中，我们主要向大家介绍Bootstrap框架为大家提供的按钮组组件查看全部
-
表单控件的禁用状态和普通的表单禁用状态实现方法是一样的，在相应的表单控件上添加属性“disabled”。 使用方法为：只需要在需要禁用的表单控件上加上“disabled”即可： <input class="form-control" type="text" placeholder="表单已禁用，不能输入" disabled>查看全部
-
表单控件状态(禁用状态):在相应的表单控件上添加属性“disabled” 在Bootstrap框架中，如果fieldset设置了disabled属性，整个域都将处于被禁用状态。<fieldset disabled><div>全部禁用了。。。</div>....</fieldset > 据说对于整个禁用的域中，如果legend中有输入框的话，这个输入框是无法被禁用的。查看全部
-
焦点状态是通过伪类“:focus”来实现。Bootstrap框架中表单控件的焦点状态删除了outline的默认样式，重新添加阴影效果。 源码请查阅bootstrap.css文件第1707行～第1712行： .form-control:focus { border-color: #66afe9; outline: 0; -webkit-box-shadow: inset 0 1px 1pxrgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, .6); box-shadow: inset 0 1px 1pxrgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, .6); } 从源码中我们可以看出，要让控件在焦点状态下有上面样式效果，需要给控件添加类名“form-control”： <form role="form" class="form-horizontal"> <div class="form-group"> <div class="col-xs-6"> <input class="form-control input-lg" type="text" placeholder="不是焦点状态下效果"> </div> <div class="col-xs-6"> <input class="form-control input-lg" type="text" placeholder="焦点点状态下效果"> </div> </div> </form>查看全部
-
前面看到的表单控件都正常的大小。可以通过设置控件的height，line-height，padding和font-size等属性来实现控件的高度设置。不过Bootstrap框架还提供了两个不同的类名，用来控制表单控件的高度。这两个类名是： 1、input-sm:让控件比正常大小更小 2、input-lg:让控件比正常大小更大 这两个类适用于表单中的input，textarea和select控件 如果表单使用了类名“form-horizontal”，其中“form-group”就相当于网格系统中的“row”。换句话说，如果没有这样做，要通过网格系统来控制表单控件宽度查看全部
-
有时候，为了布局的需要，将复选框和单选按钮需要水平排列。Bootstrap框架也做了这方面的考虑： 1、如果checkbox需要水平排列，只需要在label标签上添加类名“checkbox-inline” 2、如果radio需要水平排列，只需要在label标签上添加类名“radio-inline”查看全部
-
文本域和原始使用方法一样，设置rows可定义其高度，设置cols可以设置其宽度。但如果textarea元素中添加了类名“form-control”类名，则无需设置cols属性。因为Bootstrap框架中的“form-control”样式的表单控件宽度为100%或auto。 <form role="form"> <div class="form-group"> <textarea class="form-control" rows="3"></textarea> </div> </form>查看全部
-
Bootstrap框架中的下拉选择框使用和原始的一致，多行选择设置multiple属性的值为multiple。查看全部
-
为了让控件在各种表单风格中样式不出错，需要添加类名“form-control”，如： <form role="form"> <div class="form-group"> <input type="email" class="form-control" placeholder="Enter email"> </div> </form>查看全部
-
为什么添加了label标签，而且没有放置在”form-group”这样的容器中，input也不会换行；还有label标签怎么没显示出来。如果你仔细看，在label标签运用了一个类名“sr-only”，标签没显示就是这个样式将标签隐藏了。查看全部
-
如果你要在input前面添加一个label标签时，会导致input换行显示。如果你必须添加这样的一个label标签，并且不想让input换行，你需要将label标签也放在容器“form-group”中，如： <div class="form-group"> <label class="sr-only" for="exampleInputEmail2">Email address</label> </div> <div class="form-group"> <inputtype="email" class="form-control" id="exampleInputEmail2" placeholder="Enter email"> </div>查看全部
举报
0/150
提交
取消