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

玩转Bootstrap(基础)

  • 而且对于<pre>代码块风格,标签前面留多少个空格,在显示效果中就会留多少个空格。
    查看全部
    0 采集 收起 来源:代码(一)

    2018-03-22

  • 想要当前li不缩进,则要在它的父ul上添加class="list-unstyled"
    查看全部
  • bootstrap模板为使IE6、7、8版本(IE9以下版本)浏览器兼容html5新增的标签,引入下面代码文件即可。 <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script> 同理为使IE6、7、8版本浏览器兼容css3样式,引入下面代码: <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
    查看全部
    0 采集 收起 来源:基本的HTML模板

    2018-03-22

  • 使用网格,可以容易的设计两栏、三栏等常见的页面结构。 实现原理:网格系统的实现原理非常简单,仅仅是通过定义容器大小,平分12份(也有平分成24份或32份,但12份是最常见的),再调整内外边距,最后结合媒体查询,就制作出了强大的响应式网格系统。Bootstrap框架中的网格系统就是将容器平分成12份。
    查看全部
    0 采集 收起 来源:实现原理

    2015-01-07

  • <br> <br> <div class="container"> <div class="row"></div> <div class="col-md-8">我占8列 <div class="row"> <div class="col-md-8">我占8列</div> <div class="col-md-4">我占4列</div> </div> </div> <div class="col-md-4">我占4列 <div class="row"> <div class="col-md-9">我占8列</div> <div class="col-md-3">我占4列</div> </row> </div> </div>
    查看全部
    0 采集 收起 来源:列的嵌套

    2018-03-22

  • bootstrap的reset.css
    查看全部
    0 采集 收起 来源:全局样式

    2015-01-06

  • http://getbootstrap.com/
    查看全部
  • “.pre-scrollable”,就可以控制代码块区域最大高度为340px,一旦超出这个高度,就会在Y轴出现滚动条。
    查看全部
    0 采集 收起 来源:代码(二)

    2015-01-06

  • 三种代码风格: 1、使用<code></code>来显示单行内联代码 2、使用<pre></pre>来显示多行块代码 3、使用<kbd></kbd>来显示用户输入代码
    查看全部
    1 采集 收起 来源:代码(一)

    2018-03-22

  • 列排序其实就是改变列的方向,就是改变左右浮动,并且设置浮动的距离。在Bootstrap框架的网格系统中是通过添加类名“col-md-push-*”和“col-md-pull-*” (其中星号代表移动的列组合数)。 “col-md-4”居左,“col-md-8”居右,如果要互换位置,需要将“col-md-4”向右移动8个列的距离,也就是8个offset ,也就是在“<div class=“col-md-4”>”添加类名“col-md-push-8”,调用其样式 也要将“col-md-8”向左移动4个列的距离,也就是4个offset,在“<div class=”col-md-8”>”上添加类名“col-md-pull-4”
    查看全部
    0 采集 收起 来源:列排序

    2018-03-22

  • 有的时候,我们不希望相邻的两个列紧靠在一起,但又不想使用margin或者其他的技术手段来。这个时候就可以使用列偏移(offset)功能来实现。使用列偏移也非常简单,只需要在列元素上添加类名“col-md-offset-*”(其中星号代表要偏移的列组合数),那么具有这个类名的列就会向右偏移。例如,你在列元素上添加“col-md-offset-4”,表示该列向右移动4个列的宽度。 不过有一个细节需要注意,使用”col-md-offset-*”对列进行向右偏移时,要保证列与偏移列的总数不超过12,不然会致列断行显示
    查看全部
    0 采集 收起 来源:列偏移

    2015-01-06

  • 1、数据行(.row)必须包含在容器(.container)中,以便为其赋予合适的对齐方式和内距(padding)。 2、在行(.row)中可以添加列(.column),但列数之和不能超过平分的总列数,比如12。 3、具体内容应当放置在列容器(column)之内,而且只有列(column)才可以作为行容器(.row)的直接子元素 4、通过设置内距(padding)从而创建列与列之间的间距。然后通过为第一列和最后一列设置负值的外距(margin)来抵消内距(padding)的影响
    查看全部
    0 采集 收起 来源:工作原理

    2015-01-06

  • 网格系统的实现原理非常简单,仅仅是通过定义容器大小,平分12份(也有平分成24份或32份,但12份是最常见的),再调整内外边距,最后结合媒体查询,就制作出了强大的响应式网格系统。Bootstrap框架中的网格系统就是将容器平分成12份。 在使用的时候大家可以根据实际情况重新编译LESS(或Sass)源码来修改12这个数值(也就是换成24或32,当然你也可以分成更多,但不建议这样使用)
    查看全部
    0 采集 收起 来源:实现原理

    2015-01-06

  • 图像在网页制作中也是常要用到的元素,在Bootstrap框架中对于图像的样式风格提供以下几种风格: 1、img-responsive:响应式图片,主要针对于响应式设计 2、img-rounded:圆角图片 3、img-circle:圆形图片 4、img-thumbnail:缩略图片 设置图片大小: 由于样式没有对图片做大小上的样式限制,所以在实际使用的时候,需要通过其他的方式来处理图片大小。比如说控制图片容器大小。(注意不可以通过css样式直接修改img图片的大小,这样操作就不响应了)
    查看全部
    0 采集 收起 来源:图像

    2015-01-06

  • 通過添加類名「.list-inline」來實現內聯列表,簡單點說就是把垂直列表換成水平列表,而且去掉項目符號(編號),保持水平顯示。也可以說內聯列表就是為製作水平導航而生。
    查看全部

举报

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

微信扫码,参与3人拼团

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

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