第五章Bookstrap
响应式原理:
@media screen and (min-width:300px) and (max-width:500px) {
/* CSS 代码 */
}
#代表页面宽度大于300px和小雨500px之间时,使用CSS代码 栅格系统的应用:
<div class="container"> 记住container类
<h1>行的栅格系统</h1>
<div class="row"> 添加了row类
<div class=" col-md-4">Bootstrap 需要为页面内容和栅格系统包裹一个 .container 容器。我们提供了两个作此用处的类。注意,由于 padding 等属性的原因,这两种 容器类不能互相嵌套</div>
<div class=" col-md-4">Bootstrap 需要为页面内容和栅格系统包裹一个 .container 容器。我们提供了两个作此用处的类。注意,由于 padding 等属性的原因,这两种 容器类不能互相嵌套</div>
<div class=" col-md-4">Bootstrap 需要为页面内容和栅格系统包裹一个 .container 容器。我们提供了两个作此用处的类。注意,由于 padding 等属性的原因,这两种 容器类不能互相嵌套</div>
<div class=" col-md-4">Bootstrap 需要为页面内容和栅格系统包裹一个 .container 容器。我们提供了两个作此用处的类。注意,由于 padding 等属性的原因,这两种 容器类不能互相嵌套</div>
<div class=" col-md-4">Bootstrap 需要为页面内容和栅格系统包裹一个 .container 容器。我们提供了两个作此用处的类。注意,由于 padding 等属性的原因,这两种 容器类不能互相嵌套</div>
<div class=" col-md-4">Bootstrap 需要为页面内容和栅格系统包裹一个 .container 容器。我们提供了两个作此用处的类。注意,由于 padding 等属性的原因,这两种 容器类不能互相嵌套</div>
</div>
</div>
iconfont 阿里的图标库
其他CSS样式查看官网介绍
第五章Bookstrap的更多相关文章
- 《Django By Example》第五章 中文 翻译 (个人学习,渣翻)
书籍出处:https://www.packtpub.com/web-development/django-example 原作者:Antonio Melé (译者@ucag注:大家好,我是新来的翻译, ...
- 《Entity Framework 6 Recipes》中文翻译系列 (22) -----第五章 加载实体和导航属性之延迟加载
翻译的初衷以及为什么选择<Entity Framework 6 Recipes>来学习,请看本系列开篇 第五章 加载实体和导航属性 实体框架提供了非常棒的建模环境,它允许开发人员可视化地使 ...
- 精通Web Analytics 2.0 (7) 第五章:荣耀之钥:度量成功
精通Web Analytics 2.0 : 用户中心科学与在线统计艺术 第五章:荣耀之钥:度量成功 我们的分析师常常得不到我们应得的喜欢,尊重和资金,因为我们没有充分地衡量一个黄金概念:成果.因为我们 ...
- 《Linux内核设计与实现》读书笔记 第五章 系统调用
第五章系统调用 系统调用是用户进程与内核进行交互的接口.为了保护系统稳定可靠,避免应用程序恣意忘形. 5.1与内核通信 系统调用在用户空间进程和硬件设备间添加了一个中间层, 作用:为用户空间提供了一种 ...
- Java语言程序设计(基础篇) 第五章 循环
第五章 循环 5.2 while循环 1.while循环的语法如下: while(循环继续条件){ //循环体 语句(组); } 2.程序:提示用户为两个个位数相加的问题给出答案 package co ...
- 读《编写可维护的JavaScript》第五章总结
第五章 UI层的松耦合 5.1 什么是松耦合 在Web开发中,用户界面是由三个彼此隔离又相互作用的层定义的: HTML是用来定义页面的数据和语义 CSS用来给页面添加样式 JavaScript用来给页 ...
- 《Linux内核设计与实现》课本第五章学习笔记——20135203齐岳
<Linux内核设计与实现>课本第五章学习笔记 By20135203齐岳 与内核通信 用户空间进程和硬件设备之间通过系统调用来交互,其主要作用有三个. 为用户空间提供了硬件的抽象接口. 保 ...
- Android深度探索--HAL与驱动开发----第五章读书笔记
第五章主要学习了搭建S3C6410开发板的测试环境.首先要了解到S3C6410是一款低功耗.高性价比的RISC处理器它是基于ARMI1内核,广泛应用于移动电话和通用处理等领域. 开发板从技术上说与我们 ...
- 《java编程思想》读书笔记(一)开篇&第五章(1)
2017 ---新篇章 今天终于找到阅读<java编程思想>这本书方法了,表示打开了一个新世界. 第一章:对象导论 内容不多但也有20页,主要是对整本书的一个概括.因为已经有过完整JAV ...
随机推荐
- EFCore Lazy Loading + Inheritance = 干净的数据表 (二) 【献给处女座的DB First程序猿】
前言 本篇是上一篇EFCore Lazy Loading + Inheritance = 干净的数据表 (一) [献给处女座的DB First程序猿] 前菜 的续篇.这一篇才是真的为处女座的DB Fi ...
- ABP-DDD学习
有一个比较大的项目,打算使用 DDD +ABP +微服务 开发: 1.涉及到社交: 业务场景比较复杂:会多变: 2.采用前后端分离,netcore+vue; 3.部署采用K8S +docker 进行部 ...
- web前端框架之Vue hello world
[博客园cnblogs笔者m-yb原创,转载请加本文博客链接,笔者github: https://github.com/mayangbo666,公众号aandb7,QQ群927113708] http ...
- js中的一些简单问题
1.JavaScript的组成: ECMAScript标准--基本的语法和对象 DOM:Document Object Model 文档对象模型 BOM:Broswer Object Model 浏览 ...
- 使用LinkedList类生成一个集合对象,循环加入“小样1”,“小样2”,“小样3”,“小样4”,“小样5”……“小样100”。输出这个集合的大小。再使用循环删除这个集合中所有名字为偶数的对象,比如“小样6”,“小样100”,都是偶数名。最后:循环输出集合中所有的对象,看是否删除成功。
package com.lanxi.demo1_8; import java.util.Iterator; import java.util.LinkedList; public class Test ...
- Error "java.lang.NoClassDefFoundError:org/openxmlformats/schemas/spreadsheetml/x2006/main/CTExtensionList" in SoapUI
After upgrade readyAPI 1.9 to the higher version, pop up error "java.lang.NoClassDefFoundError: ...
- 原生js实现淘宝图片切换
这个淘宝图片切换具体效果就是:鼠标移上底部一行中的小图片,上面大图片区域就会显示对应的图片. gif图片看起来还挺酷的,其实实现很简单,用原生js绑定事件改变大图片区域的src. 上代码,html部分 ...
- shell练习题4
需求如下: 系统logrotate工具,可以完成日志切割.归档.写一个shell脚本实现类似功能. 举例:假如服务的输出日志是1.log,要求每天归档一个,1.log第二天就变成1.log.1, 第三 ...
- RabbitMQ,为应对消息从发送到消费,各个环节消息丢失的解决方案
1.发送方 为保证消息到达exchange,在这个过程中不丢失. 用事务或者发送方确认机制 见<RabbitMQ实战指南>4.8节 2.为保证消息不会因为到达exchange后 ...
- RabbitMQ中声明交换器,队列时的,autoDelete=true自动删除的条件
在声明交换器和队列时,有一个属性叫autoDelete,表示是否自动删除. 如果autoDelete=true,表示自动删除.此处我们要理解,自动删除的条件是什么? 这里的关键是,自动删除的条件是向后 ...