为了账号安全,请及时绑定邮箱和手机立即绑定
  • 通过文本对齐类,可以简单方便的将文字重新对齐,如class="text-center"
    查看全部
    1 采集 收起 来源:编程练习

    2018-03-22

  • 导航条是在应用或网站中作为导航页头的响应式基础组件。它在移动设备上可以折叠(并且可开可关),且在视口(viewport)宽度增加时逐渐变为水平展开模式。响应式导航条在移动设备上默认折叠。<br> <br> 通过添加 .navbar-left 和 .navbar-right 工具类让导航链接、表单、按钮或文本对齐。两个类都会通过 CSS 设置特定方向的浮动样式。<br> <br> 添加 .navbar-static-top 类可创建一个与页面等宽度的导航条,随页面向下滚动而消失。<br> <br> 添加 .text-left 和 . text -right 工具类让导航链接、表单、按钮或文本对齐。<br> <br> 在 Bootstrap中,任何下拉菜单中均可通过添加标题来标明一组动作,添加方式为:<li class="dropdown-header">标题名称</li>。
    查看全部
    1 采集 收起 来源:练习题

    2018-03-22

  • 注意1:container-fluid 与 container 区别:前者自适应,后者固定居中。<br> 注意2:可以仅仅通过data属性API就能使用所有的bootstrap插件,无需写一行JS代码。这是bootstrap中的一等API,也应该是你的首选方式。<br> 注意3:body{padding-top:70px}//常常与固定头部导航条配合使用。<br> 注意4:当页面发生错位的时,可以用闭合标签来观察是否有标签未闭合或者标签错位。<br> 注意5:弹出框代码最好放在 body 的最后,防止被其他元素置顶。 body{padding-top:70px} 导航条的默认高度是50px
    查看全部
  • 导航条在移动端是折叠的,其的基本结构: 用<nav class=“” role=“”>标签声明,class=“navbar navbar-default”,navbar代表这是一个导航条,会应用导航条的样式,navbar-default代表这是一个默认的导航条样式(为白色),role=“navigation”代表这是一个导航条;为nav添加navbar-fixed-top可以使导航条固定在顶部,固定的导航条会遮住页面上其他内容,除非给body元素设置padding,导航条的默认宽度是50px,可设置:body{padding-top:70px;},添加navbar-inverse可使导航条变为黑色 内容包裹在<div class="container-fluid">中,class=“container”也可以,它代表居中的固定大小的导航条,而fluid代表导航条自适应浏览器大小的 <div class="navbar-header">代表导航条头部其中包含一段代码使在屏幕宽度小于一定值时导航条的按钮会折叠为一个下拉图标,代码: <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <a class="navbar-brand" href="#">brand</a>(为最左侧的文字,如:现代浏览器) </div>
    查看全部
  • center-block 控制块状元素居中对齐
    查看全部
    0 采集 收起 来源:编程练习

    2016-08-24

  • bootstrap是移动设备优先的,它针对移动设备的样式融合进了框架的每个角落 初始化框架使用的是Normalize.css 栅格结构(grid system) 栅格布局中所有的行必须放在class为container的容器中. 通过一系列的行(row)与列(column)的组合来创建页面布局, 自动分为最多12列,内容在列中. 栅格的class在屏幕宽度大于或等于阈值的设备上起作用,并针对小屏幕设备所设置的class覆盖掉 对所有按钮外部加上<div class="btn-group">后所有按钮会成为按钮组,bootstrap会自动为第一个及最后一个加圆角,这些按钮会连在一块。按钮的功能的实现可用js插件 js插件包括了所有jqury,可一次引入所有插件,也可单个引入。 栅格的class在屏幕宽度大于或等于阈值的设备上起作用,并针对小屏幕设备所设置的class覆盖掉。 第一以及最后一个元素设置负的margin,抵消掉影响。 Tooltip插件--鼠标放上就可显示相关提示内容。
    查看全部
  • rel="stylesheet"——> rel是relationship的英文缩写,stylesheet中style是样式的意思,sheet是表格之意,总起来是样式表的意思 rel="stylesheet" 描述了当前页面与href所指定文档的关系.即说明的是,href连接的文档是一个新式表,说白了就是指明你链进来的对象是个什么东西的。 <!DOCTYPE html> <html lang="zh-cn"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <link href=" //netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet"> <title>Hello World</title> </head> <body> <h1 class="text-center" >Hello World</h1> <p class="text-center"><button class="btn btn-primary ">我是按钮,按我一下!</button></p> <script src="http://cdn.bootcss.com/jquery/1.11.1/jquery.min.js"></script> <script src="http://cdn.bootcss.com/bootstrap/3.2.0/js/bootstrap.min.js"></script> </body> </html>
    查看全部
    0 采集 收起 来源:编程练习

    2018-03-22

  • 标准bootstrap使用模板
    查看全部
  • daohangtiao
    查看全部
  • <p><a class="btn btn-lg btn-primary" href="#" target="_blank" role="button">点我下载</a></p>
    查看全部
    0 采集 收起 来源:滚动图片广告

    2018-03-22

  • bootstrap是移动设备优先的,它针对移动设备的样式融合进了框架的每个角落 初始化框架使用的是Normalize.css 栅格结构(grid system) 栅格布局中所有的行必须放在class为container的容器中. 通过一系列的行(row)与列(column)的组合来创建页面布局, 自动分为最多12列,内容在列中. 栅格的class在屏幕宽度大于或等于阈值的设备上起作用,并针对小屏幕设备所设置的class覆盖掉 对所有按钮外部加上<div class="btn-group">后所有按钮会成为按钮组,bootstrap会自动为第一个及最后一个加圆角,这些按钮会连在一块。按钮的功能的实现可用js插件 js插件包括了所有jqury,可一次引入所有插件,也可单个引入
    查看全部
  • css
    查看全部
  • bootstrap 包含 js ,css ,字体文件。 由于bootstrap是基于jQuery开发的所以我们在使用bootstrap 之前我们必须先去加载jQuery 由于bootstrap不支持ie 的兼容模式所以我们需要配置一个mate 标签来让ie用最新的渲染模式 <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1">: vieport:移动端虚拟视图 缺点:破坏没有针对移动端的布局 width=device-width:让vieport宽度等于设备的值 initial-scale=1:不缩放 <!--[if lt IE 9]> <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>: 让ie9以下浏览器支持html5 <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> 让ie9以下浏览器对媒体查询 <![endif]--> <!-- jQuery (necessary for Bootstrap's JavaScript plugins) --> <script src="http://code.jquery.com/jquery-1.11.2.min.js"></script> <!-- Include all compiled plugins (below), or include individual files as needed --> <script src="js/bootstrap.min.js"></script>:放在body的最下面
    查看全部
  • 简单灵活的用于搭建web页面的HTML,CSS,JavaScript的工具集
    查看全部
    0 采集 收起 来源:课程介绍

    2016-08-20

  • 栅格系统布局。行(row)必须包含字.container(固定宽度)或者.container-fluid(100%宽度)中
    查看全部
    0 采集 收起 来源:三栏简介布局

    2016-08-17

举报

0/150
提交
取消
课程须知
本课程针对Bootstrap基础知识进行概览式介绍,所以希望您已学习本网站的“玩转Bootstrap”课程知识点,同时希望您会使用HTML、CSS、JavaScript做简单的网页,如果您已具备jQuery基础知识会更好。
老师告诉你能学到什么?
1.了解Bootstrap框架基础知识。 2. 如何开始使用Bootstrap框架。 3. 如何运行初始代码,并修改成所需要的代码。 4. 如何利用Bootstrap制作响应式布局的网页。 5. 如何使用Bootstrap中的组件、插件及定制。

微信扫码,参与3人拼团

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

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