为了账号安全,请及时绑定邮箱和手机立即绑定

玩转Bootstrap(基础)

  • 那么在实际使用中,这几个类名可以配合按钮中其他颜色类名一起使用,但唯一一点不能缺少“.btn”类名: <button class="btn btn-primary btn-lg" type="button">大型按钮.btn-lg</button> <button class="btn btn-primary" type="button">正常按钮</button> <button class="btn btn-primary btn-sm" type="button">小型按钮.btn-sm</button> <button class="btn btn-primary btn-xs"
    查看全部
    0 采集 收起 来源:按钮大小

    2018-03-22

  • 注意:虽然在Bootstrap框架中使用任何标签元素都可以实现按钮风格,但个人并不建议这样使用,为了避免浏览器兼容性问题,个人强烈建议使用button或a标签来制作按钮。
    查看全部
    0 采集 收起 来源:多标签支持

    2014-10-13

  • <input type="text" class="form-control" id="inputSuccess1" placeholder="成功状态" > <span class="help-block">你输入的信息是正确的</span> <span class="glyphiconglyphicon-ok form-control-feedback"></span>
    查看全部
    0 采集 收起 来源:表单提示信息

    2018-03-22

  • <input class="form-control" type="text" placeholder="表单已禁用,不能输入" disabled>
    查看全部
  • <input class="form-control input-lg" type="text" <div class="col-xs-4"> <input class="form-control input-lg" type="text" placeholder=".col-xs-4"> </div>
    查看全部
    0 采集 收起 来源:表单控件大小

    2018-03-22

  • <label class="checkbox-inline"> <label class="radio-inline">
    查看全部
  • <div class="checkbox"> <label> <input type="checkbox" value=""> 记住密码 </label> </div> <div class="radio"> <label> <input type="radio" name="optionsRadios" id="optionsRadios1" value="love" checked> 喜欢 </label> </div>
    查看全部
  • 文本域和原始使用方法一样,设置rows可定义其高度,设置cols可以设置其宽度。但如果textarea元素中添加了类名“form-control”类名,则无需设置cols属性。因为Bootstrap框架中的“form-control”样式的表单控件宽度为100%或auto。
    查看全部
  • <div class="form-group"> <select multiple class="form-control"> <option>1</option> <option>2</option> <option>3</option> <option>4</option> <option>5</option> </select> </div>
    查看全部
  • 为了让控件在各种表单风格中样式不出错,需要添加类名“form-control”
    查看全部
  • <form>元素中添加类名“form-inline” ​那么Bootstrap为什么要这么做呢?这样不是多此一举吗?其实不是的,如果没有为输入控件设置label标签,屏幕阅读器将无法正确识别。这也是Bootstrap框架另一个优点之处,为残障人员进行了一定的考虑。
    查看全部
    0 采集 收起 来源:内联表单

    2018-03-22

  • 在<form>元素上使用类名“form-horizontal”
    查看全部
    0 采集 收起 来源:水平表单

    2018-03-22

  • <form role="form"> <div class="form-group"> <label for="exampleInputEmail1">邮箱:</label> <input type="email" class="form-control" id="exampleInputEmail1" placeholder="请输入您的邮箱地址"> </div>
    查看全部
    0 采集 收起 来源:基础表单

    2018-03-22

  • 当然表单除了这几个元素之外,还有input、select、textarea等元素,在Bootstrap框架中,通过定制了一个类名`form-control`,也就是说,如果这几个元素使用了类名“form-control”,将会实现一些设计上的定制效果。 1、宽度变成了100% 2、设置了一个浅灰色(#ccc)的边框 3、具有4px的圆角 4、设置阴影效果,并且元素得到焦点之时,阴影和边框效果会有所变化 5、设置了placeholder的颜色为#999
    查看全部
    0 采集 收起 来源:基础表单

    2014-10-13

  • 特别提示:除了”.active”之外,其他四个类名和”.table-hover”配合使用时,Bootstrap针对这几种样式也做了相应的悬浮状态的样式设置,所以如果需要给tr元素添加其他颜色样式时,在”.table-hover”表格中也要做相应的调整。 注意要实现悬浮状态,需要在<table>标签上加入table-hover类。
    查看全部

举报

0/150
提交
取消
课程须知
本教程适合具有一定前端基础的人员,对HTML和CSS有一定的了解,对于定制Bootstrap的同学需要具备LESS和Sass基础知识。
老师告诉你能学到什么?
1、了解Bootstrap框架 2、如何使用Bootstrap制作Web页面或Web应用程序 3、如何定制个性化Bootstrap

微信扫码,参与3人拼团

意见反馈 帮助中心 APP下载
官方微信
友情提示:

您好,此课程属于迁移课程,您已购买该课程,无需重复购买,感谢您对慕课网的支持!