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

玩转Bootstrap(基础)

  • 在“nav-pills”的基础上添加一个“nav-stacked” 即可实现垂直导航
    查看全部
  • 在“.btn-group”类上追加“dropup”类名实现向上弹起的下拉菜单
    查看全部
  • 按钮组“btn-group”上追加一个“btn-group-justified” 即可实现按钮等比
    查看全部
  • 把水平分组的“btn-group”类名换成“btn-group-vertical”即可实现垂直导航显示效果
    查看全部
  • 下拉菜单和普通的按钮组排列在一起,实现类似于导航菜单的效果。 只需要把当初制作下拉菜单的“dropdown”的容器换成“btn-group”,并且和普通的按钮放在同一级.
    查看全部
  • placeholder="请输入您的邮箱地址"
    查看全部
  • 内联表单 <form class="form-inline" role="form">
    查看全部
    0 采集 收起 来源:内联表单

    2018-03-22

  • 水平表单 Bootstrap框架默认的表单是垂直显示风格,但很多时候我们需要的水平表单风格(标签居左,表单控件居右)。 在Bootstrap框架中要实现水平表单效果,必须满足以下两个条件: 1、在<form>元素是使用类名“form-horizontal”。 2、配合Bootstrap框架的网格系统。(网格布局会在以后的章节中详细讲解) 在<form>元素上使用类名“form-horizontal”主要有以下几个作用: 1、设置表单控件padding和margin值。 2、改变“form-group”的表现形式,类似于网格系统的“row”
    查看全部
    0 采集 收起 来源:水平表单

    2018-03-22

  • ☑ .table:基础表格 ☑ .table-striped:斑马线表格 ☑ .table-bordered:带边框的表格 ☑ .table-hover:鼠标悬停高亮的表格 ☑ .table-condensed:紧凑型表格 ☑ .table-responsive:响应式表格
    查看全部
    0 采集 收起 来源:表格

    2014-11-07

  • bs:做了3件事 1.<pre></pre> 改写成灰色区块 2.<code></code>变成了红色 3<tbd></tbd>美化成按键效果
    查看全部
    0 采集 收起 来源:代码(一)

    2018-03-22

  • Bootstrap可以给<dl>添加类名“.dl-horizontal”给定义列表实现水平显示效果。
    查看全部
  • 在制作等分按钮组时,请尽量使用<a>标签元素来制作按钮,因为使用<button>标签元素时,使用display:table在部分浏览器下支持并不友好。
    查看全部
  • bootstrap模板为使IE6、7、8版本(IE9以下版本)浏览器兼容html5新增的标签,引入下面代码文件即可。 <!--[if lt IE 9]> <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script> <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script> <![endif]-->
    查看全部
    0 采集 收起 来源:基本的HTML模板

    2018-03-22

  • meta 兼容IE9以下,添加对媒体查询和HTML5标签的支持
    查看全部
  • 超大屏幕(Jumbotron)。顾名思义该组件可以增加标题的大小,并为登陆页面内容添加更多的外边距(margin)。使用超大屏幕(Jumbotron)的步骤如下: 创建一个带有 class .jumbotron. 的容器 <div>。 除了更大的 <h1>,字体粗细 font-weight 被减为 200px。 为了获得占用全部宽度且不带圆角的超大屏幕,请在所有的 .container class 之外使用 .jumbotron class Label class 加在span身上,再通过H1-H6标签嵌套来改变大小
    查看全部

举报

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

微信扫码,参与3人拼团

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

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