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

玩转Bootstrap(基础)

  • Bootstrap的全局样式采用了"normalize.css",是一个让各个浏览器都标准显示输出的框架。
    查看全部
    0 采集 收起 来源:全局样式

    2018-03-22

  • bootstrap.js 需要jquery支持, 这是一个Bootstrap的HTML标准模板
    查看全部
    0 采集 收起 来源:基本的HTML模板

    2018-03-22

  • 等分按钮的效果在移动端上特别的实用
    查看全部
  • 用btn-group代替dropdown实现导航菜单样式的下拉菜单
    查看全部
  • 1、使用一个名为“dropdown”的容器包裹了整个下拉菜单元素,示例中为: <div class="dropdown"></div> 2、使用了一个<button>按钮做为父菜单,并且定义类名“dropdown-toggle”和自定义“data-toggle”属性,且值必须和最外容器类名一致,此示例为: data-toggle="dropdown" 3、下拉菜单项使用一个ul列表,并且定义一个类名为“dropdown-menu”,此示例为: <ul class="dropdown-menu">
    查看全部
  • 当然表单除了这几个元素之外,还有input、select、textarea等元素,在Bootstrap框架中,通过定制了一个类名`form-control`,也就是说,如果这几个元素使用了类名“form-control”,将会实现一些设计上的定制效果。 1、宽度变成了100% 2、设置了一个浅灰色(#ccc)的边框 3、具有4px的圆角 4、设置阴影效果,并且元素得到焦点之时,阴影和边框效果会有所变化 5、设置了placeholder的颜色为#999
    查看全部
  • 嵌套列表。
    查看全部
  • 水平表单 在Bootstrap框架中要实现水平表单效果,必须满足以下两个条件: 1、在<form>元素是使用类名“form-horizontal”。 2、配合Bootstrap框架的网格系统。(网格布局会在以后的章节中详细讲解) 在<form>元素上使用类名“form-horizontal”主要有以下几个作用: 1、设置表单控件padding和margin值。 2、改变“form-group”的表现形式,类似于网格系统的“row”。
    查看全部
    0 采集 收起 来源:水平表单

    2018-03-22

  • 响应式表格
    查看全部
  • bootstrap.js 需要jquery支持
    查看全部
    0 采集 收起 来源:基本的HTML模板

    2018-03-22

  • 单行的,需要套嵌在class为checkbox,radio的div中
    查看全部
  • table-striped:仅是在tbody隔行有一个浅灰色的背景色 .table-striped > tbody > tr:nth-child(odd) > td, .table-striped > tbody > tr:nth-child(odd) > th { background-color: #f9f9f9; }
    查看全部
  • 主要源码查看bootstrap.css文件第1402行~第1441行,由于代码太长,此处不一一列举。 “.table”主要有三个作用: ☑ 给表格设置了margin-bottom:20px以及设置单元内距 ☑ 在thead底部设置了一个2px的浅灰实线 ☑ 每个单元格顶部设置了一个1px的浅灰实线
    查看全部
  • ☑ .table:基础表格 ☑ .table-striped:斑马线表格 ☑ .table-bordered:带边框的表格 ☑ .table-hover:鼠标悬停高亮的表格 ☑ .table-condensed:紧凑型表格 ☑ .table-responsive:响应式表格
    查看全部
    0 采集 收起 来源:表格

    2018-03-22

  • 如果pre是大区块的话,高度超出了340px 需要增加pre-scrollable属性
    查看全部
    0 采集 收起 来源:代码(二)

    2018-03-22

举报

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

微信扫码,参与3人拼团

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

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