我们平时用ul或ol标签来罗列文章列表时默认是一列，为了美观起见，想把它们两列显示要如何操作呢？怎么用css定义它们？
所以在创建列的时候要指定列的宽度(当前列要占据几列的宽) 4、列 会根据适用的屏幕分成4中类型 类： 1、 -2 : 在超小屏幕中，占两列的宽(width:16.66%) ...... .col-xs-12: 在超小屏幕中 ，占12列的宽(width:100%) 2、.col-md-* .col-md-1 : 在中型屏幕中，占一列的宽( 每个列都可以指定向右偏移几列的位置 .col-xs-offset-n : 在 xs 屏幕下，当前列要向右偏移n列的位置 .col-sm-offset-n : 在 sm 屏幕下，当前列要向右偏移n列的位置 .col-md-offset-n : 在 md 屏幕下，当前列要向右偏移n列的位置 .
发布文章赢千元好礼！
(相当于html页面的子盒子模型，相当于table中的tr) 4.png 3.栅格样式的核心原理 a.版心容器（container是响应式版心，container-fluid是流式版心） 他们两者唯一的区别是 992,(4)在 768<= 屏幕宽度 < 992时，占6份(二分之一),(5) <768,直接显示一行 5.png 2-版心容器container bootstrap中有两种版心容器可供使用者选择 container -- 列：子元素 --> 屏幕一半 屏幕四分之一</div -- 列：子元素 --> 四分之一 四分之一</div -- 列：子元素 --> 六分之一 六分之一</div36520移动端WEB开发之响应式布局以及这些样式能实现什么样的效果(去官网查找) 2.5 bootstrap布局容器 Bootstrap 需要为页面内容和栅格系统包裹一个 .container 或者.container-fluid 容器，它提供了两个作此用处的类 中屏 ( >=992px) 宽度定为 970px 小屏 ( >=768px) 宽度定为 750px 超小屏 (100%) .container-fluid 流式布局容器 百分百宽度 Bootstrap提供了一套响应式、移动设备优先的流式栅格系统，随着屏幕或视口（viewport）尺寸的增加，系统会自动分为最多12列。 屏幕缩放发现 中屏幕和大屏幕布局是一致的，因此我们列定义为col-md-就行了，md是大于等于970以上的 小屏幕布局发生变化，因此需要为小屏幕根据需求改变样式布局 超小屏幕布局有发生变化 media (min-width: 1280px) { .container { width: 1280px; } } 移动端总结 移动端技术选型 流式布局 (百分比布局26720移动端WEB开发之响应式布局原理就是在不同屏幕下，通过媒体查询来改变这个布局容器的大小，再改变里面子元素的排列方式和大小，从而实现不同屏幕下，看到不同的页面布局和样式变化。 父容器版心的尺寸划分 超小屏幕（手机，小于 768px）：设置宽度为 100% 小屏幕（平板，大于等于 768px）：设置宽度为 750px 中等屏幕（桌面显示器，大于等于 992px）： 以及这些样式能实现什么样的效果 2.5 bootstrap布局容器 Bootstrap 需要为页面内容和栅格系统包裹一个 .container 或者.container-fluid 容器，它提供了两个作此用处的类 中屏 ( >=992px) 宽度定为 970px 小屏 ( >=768px) 宽度定为 750px 超小屏 (100%) .container-fluid 流式布局容器 百分百宽度 2.6 bootstrap栅格系统 Bootstrap提供了一套响应式、移动设备优先的流式栅格系统，随着屏幕或视口（viewport）尺寸的增加，系统会自动分为最多12列。34331Bootstrap学习文档（一）Bootstrap 是什么 Bootstrap 是最受欢迎的 HTML、CSS 和 JS 框架，用于开发响应式布局、移动设备优先的 WEB 项目，使用这个框架可以简单高效的开发出适配各种屏幕的网站应用， -- 下面两个文件是让IE9以下的IE浏览器兼容新增的HTML5标签和CSS3样式 --> <! auto（自适应） 注意：这两个class不能放在一起，可以是兄弟关系，但不能是嵌套的关系。 : red;">错误写法 Bootstrap 的栅格系统 在 Bootstrap 中一行分为 12列，也即是屏幕的宽度被分为了 12份，一份就是十二分之一的屏幕宽度，源码是通过宽度为百分比以及浮动实现的 组合使用 示例代码如下： 缩小浏览器宽度改变div的大小，仔细观察，四列，变三列，再变两列，最后变成一列的效果 <style> .row div{ background: green;62320web移动端开发(7)上传码云+响应式布局_bootstrap框架简洁高效的rem适配方案flexible.js 手机淘宝团队出的简洁高效的移动端适配库 我们再也不用写不同屏幕的媒体查询,因为js里做了处理 它的原理是把当前的设备划分成10分,但是不同设备下 bootstrap提供了一套响应式,移动设备优先的流式栅格系统,随着屏幕或视口的尺寸的增加,系统会自动最多分为12列. ,以便划分不同份数,例如: class="col-md-4 col-sm-6" 比如我们现在在大屏幕尺寸设备下,想要一个页面中有4个盒子,且排成一排,那么这是就需要将每个盒子对应所占的列数写出来 我们甚至可以嵌套,一行中有三个盒子,其中一个里面包含两个小盒子. 列偏移 假如说我们现在要让两个盒子各占4份,但是一个贴着最左侧,一个贴着最右侧,但是默认是两个都会贴着左侧对齐,那这时候我们就需要使用列偏移了.4710从零开始学 Web 之 CSS3（七）多列布局，伸缩布局一、多列布局 CSS3中新出现的多列布局 (multi-column) 是传统 HTML 网页中块状布局模式的有力扩充。 这种新语法能够让 WEB 开发人员轻松的让文本呈现多列显示。 所以，为了最大效率的使用大屏幕显示器，页面设计中需要限制文本的宽度，让文本按多列呈现，就像报纸上的新闻排版一样。 常用属性： column-count: 属性设置列的具体个数 column-width: 属性控制列的宽度 column-gap: 两列之间的缝隙间隔 column-rule: 规定列之间的宽度、样式和颜色 比如：如果设置的列的宽度大于自动计算的列的宽度，那么实际显示的效果以设置的列的宽度为准；如果设置的列的宽度无法填充整个屏幕，那么实际的宽度可能大于设置的宽度； 如果设置的列的宽度小于自动计算的列的宽度 设置列间隙大小*/ column-gap: 50px; /*4.设置列宽 原则：取大优先 1.如果人为设置宽度更大，则取更大的值，但是会填充整个屏幕，意味最终的宽度可能也会大于设置的宽度59610移动开发之响应布局Bootstrap是基于HTML、CSS和JAVASCRIPT的，它简介灵活，使得Web开发更加快捷。 Bootstrap使用四部曲： 创建文件夹结构 创建html骨架结构 引入相关样式文件 书写内容 2.3 布局容器 bootstrap需要为页面内容和栅格系统包裹一个.container 容器，Bootstrap预先定义好了这个类，叫.container它提供了两个作此用处的类。 =1200px）：宽度设置为1170px 2.container-fluid类 流式布局容器 百分百宽度 占据全部视口(ciewport)的容器 适合于单独做移动开发 3.Bootstrap Bootstrap提供了一套响应式，移动设备优先的流式栅格系统，随着屏幕或视口（viewport）尺寸的增加，系统会自动分为最多十二列 Bootstrap里面container宽度是固定的，但是不同屏幕下17220Jump Start Bootstrap 第2章网格系统允许我们适当地为我们的网站内容提供服务；它将屏幕分成多个行和列，这些行和列可以用来创建各种类型的布局。一旦定义了行和列，我们就可以决定将哪个HTML元素放置在何处。 Bootstrap网格系统将屏幕划分为每行12列；列的宽度根据屏幕的大小而变化。因此，网格系统是响应式的，当浏览器窗口的大小发生变化时，这些列会动态地调整自身大小。 在Bootstrap中，列被创建为全屏宽度被12等分后，占据的份额。 由于我们必须在较小的显示器上实现两列布局，我们必须强制每一列跨越6格。这样，在每一行中，我们只得到两列(2x6格=12格)。但这里只有一行。 这两个类将帮助我们为我们的列提供一些背景颜色。现在，HTML页面应该类似于图2.13的屏幕快照。 ?30640从零开始学 Web 之 移动Web（七）Bootstrap-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries: 这两个文件的引入是为了支持IE8下面的 html5元素和媒体查询：因为在IE8下面默认不支持HTML5和媒体查询，所以需要引入两个插件--> <! --只有IE9之前才会加载这两个文件 lt:less than--> <script src=".. 4、bootstrap 栅格系统 概念：Bootstrap 提供了一套响应式、移动设备优先的流式栅格系统，随着<em>屏幕</em>或视口（viewport）尺寸的增加，系统会默认分为12<em>列</em>。 通过为“<em>列</em>（column）”设置 padding 属性，从而创建<em>列</em>与<em>列</em>之间的间隔（gutter）。39330CSS基础布局CSS布局 确定页面的大致结构，页面分多少块，每块的位置。每个部分怎么把该部分撑起来。 * CSS中BFC详解 https://www.cnblogs.com/chen-cong/p/7862832.html clear: both; 的作用是：保证该元素左右两侧 没有浮动元素 float+margin 实现两列布局 1. div1 左浮动：给出左侧的空间 2. div2 的margin-left留出 div1 的宽度. + overflow: hidden;也变为BFC块，和 * 让页面 在不同的设备上 能正常的使用 * 主要处理的是 屏幕大小的问题(严格来讲 还涉及到 是否有鼠标 是否是读屏软件 是否支持一些样式) * 在具体的方法上 涉及到 设计 和 实现 两方面。 折行：在pc端横向排布的若干个东西，在移动端 可以 一行显示两个 分多行显示。 留下自适应的空间：和两列布局类似，一列固定宽度 另一列随屏幕自适应。42920Bootstrap实用手册两个 JS ①. html5shiv.min.js，第三方的 JS，自调函数，用于让老 IE(IE8 及以下)支持 HTML5 新标记 header、footer、aside ②. respond.min.js 列 根据适用屏幕分成四种类型 A. .col-xs-* a. .col-xs-1 : 在超小屏幕中，占一列的宽(8.33%) b. .col-xs-2 : 在超小屏幕中，占两列的宽(16.66%) c. .col-xs-12 : 在超小屏幕中，占 12 列的宽(100%) B. .col-sm-*：在小型屏幕中 所占列宽数 C. .col-md-*：在中型屏幕中 所占列宽数 D. .col-lg-*： 在大型屏幕中 所占列宽数 ⑤. Less 和 Bootstrap 定制 样式语言的分类有分两种 (1).28320MDUI CSS框架 -网格布局我们提供了两个此作用的类。 .mdui-container 类占据 92% - 96% 的屏幕宽度，且最大宽度 1280px。 这句话什么意思呢，就是一整个屏幕，其宽度可以放得下12列的东西，比如说，我用 两次，就可以得到双栏，同理，用col-xs-4三次，就可以得到三栏 -- 在超小屏幕设备上，第一列 100% 宽度，第二列 50% 宽度。在小屏幕及以上设备上，第一列为 66.6% 宽度，第二列为 33.3% 宽度。 -- 在超小屏幕设备上每列都是 50% 宽度，在小屏幕及以上设备上每列 33.3% 宽度。 偏移：2列 ? 官方示范： ? 举个合适的例子，我们想让右边的方块向左移动两列，以沾满12列 ? 这样就可以了！ ?28820第131天：移动web页面的排版与布局二、百分比法. 一般的百分比都是给宽度设置百分比. 高度 自动.或者定高.一个固定的数值.如果 高度也可以百分比话.就太好 了. 可惜div 默认是没有高度的. 如果屏幕尺寸变小了. html的font-size 也跟着变小. 那么你的图片也跟着等比例变小. 推理下去,有点令人吃惊. html的font-size 一般要 = 750px 了. 但是实际使用中最好用的还是 1px = 1rem 然后用javascript 根据屏幕的宽度动态计算html 的font-size 采用rem方法布局页面的话 切图的时候要注意, 一. 多用上下布局.左右布局最多不能超过3列. 超过3列的,应该考虑把多的那一列放到内容里水平显示. 五是. 想不到了. 这个单位是屏幕的物理尺寸。各种手机都进行过自动把1mm转换成对应的px。 因为屏幕质量不一样。好的屏幕在1mm的地方可以放下10个像素。 差的屏幕1mm只能放3个像素。用放大镜看就会看出来。82410Bootstrap 响应式框架 第三集1、起步 1、<html lang="zh-cn"> 2、视口 3、跨浏览器(IE)兼容性 <meta http-equiv="x-ua-compatible" content="IE=edge"> 4、Bootstrap.css文件 5、两个兼容性JS文件 1、html5shiv.min.js 2、respond.min.js class(xs/sm/md/lg)，可以兼容更大的屏幕 小屏幕的class 可以兼容大屏幕的显示效果 col-xs-6 : 在 xs 屏幕下，占6列的宽 大屏幕的内容class是不能兼容小屏幕的，所以大屏幕的内容放在小屏幕中都是以 100%的宽度显示的（纵向排列） 3、可以在一个列(div)中，指定在不同屏幕下的宽度占比 <div 在md中占3列的宽(1行中能显示4列) 4、指定列在特定屏幕下隐藏 .hidden-lg : 在 lg 屏幕下隐藏 .hidden-md : 在 md 屏幕下隐藏18830iftop---实时流量监控工具安装方法2：(懒人办法，最简单) 直接省略上面的步骤 按https://www.vpser.net/manage/centos-rhel-linux-third-party-source-epel.html 中间的<= =>这两个左右箭头，表示的是流量的方向。 ，输入要过滤的字符，比如ip,按回车后，屏幕就只显示这个IP相关的流量信息; 按L切换显示画面上边的刻度;刻度不同，流量图形条会有变化; 按j或按k可以向上或向下滚动屏幕显示的连接记录; 按1或2或3可以根据右侧显示的三列流量数据进行排序 4.2 iftop的输出从整体上可以分为三大部分： 第一部分是iftop输出中最上面的一行，此行是流量刻度，用于显示网卡带宽流量； 第二部分是iftop输出中最大的一个部分，此部分又分为左中右三列 其中中列的 => 代表发送数据，<=代表接收数据，通过这个指示箭头可以很清晰的知道两个IP之间的通信情况。最右列又分为三个小列，这些实时参数分别表示外部IP连接到本机2s 10s和40s的平均流量。1K10
以及这些样式能实现什么样的效果(去官网查找) 2.5 bootstrap布局容器 Bootstrap 需要为页面内容和栅格系统包裹一个 .container 或者.container-fluid 容器，它提供了两个作此用处的类 中屏 ( >=992px) 宽度定为 970px 小屏 ( >=768px) 宽度定为 750px 超小屏 (100%) .container-fluid 流式布局容器 百分百宽度 Bootstrap提供了一套响应式、移动设备优先的流式栅格系统，随着屏幕或视口（viewport）尺寸的增加，系统会自动分为最多12列。 屏幕缩放发现 中屏幕和大屏幕布局是一致的，因此我们列定义为col-md-就行了，md是大于等于970以上的 小屏幕布局发生变化，因此需要为小屏幕根据需求改变样式布局 超小屏幕布局有发生变化 media (min-width: 1280px) { .container { width: 1280px; } } 移动端总结 移动端技术选型 流式布局 (百分比布局
原理就是在不同屏幕下，通过媒体查询来改变这个布局容器的大小，再改变里面子元素的排列方式和大小，从而实现不同屏幕下，看到不同的页面布局和样式变化。 父容器版心的尺寸划分 超小屏幕（手机，小于 768px）：设置宽度为 100% 小屏幕（平板，大于等于 768px）：设置宽度为 750px 中等屏幕（桌面显示器，大于等于 992px）： 以及这些样式能实现什么样的效果 2.5 bootstrap布局容器 Bootstrap 需要为页面内容和栅格系统包裹一个 .container 或者.container-fluid 容器，它提供了两个作此用处的类 中屏 ( >=992px) 宽度定为 970px 小屏 ( >=768px) 宽度定为 750px 超小屏 (100%) .container-fluid 流式布局容器 百分百宽度 2.6 bootstrap栅格系统 Bootstrap提供了一套响应式、移动设备优先的流式栅格系统，随着屏幕或视口（viewport）尺寸的增加，系统会自动分为最多12列。
Bootstrap 是什么 Bootstrap 是最受欢迎的 HTML、CSS 和 JS 框架，用于开发响应式布局、移动设备优先的 WEB 项目，使用这个框架可以简单高效的开发出适配各种屏幕的网站应用， -- 下面两个文件是让IE9以下的IE浏览器兼容新增的HTML5标签和CSS3样式 --> <! auto（自适应） 注意：这两个class不能放在一起，可以是兄弟关系，但不能是嵌套的关系。 : red;">错误写法
简洁高效的rem适配方案flexible.js 手机淘宝团队出的简洁高效的移动端适配库 我们再也不用写不同屏幕的媒体查询,因为js里做了处理 它的原理是把当前的设备划分成10分,但是不同设备下 bootstrap提供了一套响应式,移动设备优先的流式栅格系统,随着屏幕或视口的尺寸的增加,系统会自动最多分为12列. ,以便划分不同份数,例如: class="col-md-4 col-sm-6" 比如我们现在在大屏幕尺寸设备下,想要一个页面中有4个盒子,且排成一排,那么这是就需要将每个盒子对应所占的列数写出来 我们甚至可以嵌套,一行中有三个盒子,其中一个里面包含两个小盒子. 列偏移 假如说我们现在要让两个盒子各占4份,但是一个贴着最左侧,一个贴着最右侧,但是默认是两个都会贴着左侧对齐,那这时候我们就需要使用列偏移了.
一、多列布局 CSS3中新出现的多列布局 (multi-column) 是传统 HTML 网页中块状布局模式的有力扩充。 这种新语法能够让 WEB 开发人员轻松的让文本呈现多列显示。 所以，为了最大效率的使用大屏幕显示器，页面设计中需要限制文本的宽度，让文本按多列呈现，就像报纸上的新闻排版一样。 常用属性： column-count: 属性设置列的具体个数 column-width: 属性控制列的宽度 column-gap: 两列之间的缝隙间隔 column-rule: 规定列之间的宽度、样式和颜色 比如：如果设置的列的宽度大于自动计算的列的宽度，那么实际显示的效果以设置的列的宽度为准；如果设置的列的宽度无法填充整个屏幕，那么实际的宽度可能大于设置的宽度； 如果设置的列的宽度小于自动计算的列的宽度 设置列间隙大小*/ column-gap: 50px; /*4.设置列宽 原则：取大优先 1.如果人为设置宽度更大，则取更大的值，但是会填充整个屏幕，意味最终的宽度可能也会大于设置的宽度
Bootstrap是基于HTML、CSS和JAVASCRIPT的，它简介灵活，使得Web开发更加快捷。 Bootstrap使用四部曲： 创建文件夹结构 创建html骨架结构 引入相关样式文件 书写内容 2.3 布局容器 bootstrap需要为页面内容和栅格系统包裹一个.container 容器，Bootstrap预先定义好了这个类，叫.container它提供了两个作此用处的类。 =1200px）：宽度设置为1170px 2.container-fluid类 流式布局容器 百分百宽度 占据全部视口(ciewport)的容器 适合于单独做移动开发 3.Bootstrap Bootstrap提供了一套响应式，移动设备优先的流式栅格系统，随着屏幕或视口（viewport）尺寸的增加，系统会自动分为最多十二列 Bootstrap里面container宽度是固定的，但是不同屏幕下
网格系统允许我们适当地为我们的网站内容提供服务；它将屏幕分成多个行和列，这些行和列可以用来创建各种类型的布局。一旦定义了行和列，我们就可以决定将哪个HTML元素放置在何处。 Bootstrap网格系统将屏幕划分为每行12列；列的宽度根据屏幕的大小而变化。因此，网格系统是响应式的，当浏览器窗口的大小发生变化时，这些列会动态地调整自身大小。 在Bootstrap中，列被创建为全屏宽度被12等分后，占据的份额。 由于我们必须在较小的显示器上实现两列布局，我们必须强制每一列跨越6格。这样，在每一行中，我们只得到两列(2x6格=12格)。但这里只有一行。 这两个类将帮助我们为我们的列提供一些背景颜色。现在，HTML页面应该类似于图2.13的屏幕快照。 ?
-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries: 这两个文件的引入是为了支持IE8下面的 html5元素和媒体查询：因为在IE8下面默认不支持HTML5和媒体查询，所以需要引入两个插件--> <! --只有IE9之前才会加载这两个文件 lt:less than--> <script src=".. 4、bootstrap 栅格系统 概念：Bootstrap 提供了一套响应式、移动设备优先的流式栅格系统，随着<em>屏幕</em>或视口（viewport）尺寸的增加，系统会默认分为12<em>列</em>。 通过为“<em>列</em>（column）”设置 padding 属性，从而创建<em>列</em>与<em>列</em>之间的间隔（gutter）。
CSS布局 确定页面的大致结构，页面分多少块，每块的位置。每个部分怎么把该部分撑起来。 * CSS中BFC详解 https://www.cnblogs.com/chen-cong/p/7862832.html clear: both; 的作用是：保证该元素左右两侧 没有浮动元素 float+margin 实现两列布局 1. div1 左浮动：给出左侧的空间 2. div2 的margin-left留出 div1 的宽度. + overflow: hidden;也变为BFC块，和 * 让页面 在不同的设备上 能正常的使用 * 主要处理的是 屏幕大小的问题(严格来讲 还涉及到 是否有鼠标 是否是读屏软件 是否支持一些样式) * 在具体的方法上 涉及到 设计 和 实现 两方面。 折行：在pc端横向排布的若干个东西，在移动端 可以 一行显示两个 分多行显示。 留下自适应的空间：和两列布局类似，一列固定宽度 另一列随屏幕自适应。
两个 JS ①. html5shiv.min.js，第三方的 JS，自调函数，用于让老 IE(IE8 及以下)支持 HTML5 新标记 header、footer、aside ②. respond.min.js 列 根据适用屏幕分成四种类型 A. .col-xs-* a. .col-xs-1 : 在超小屏幕中，占一列的宽(8.33%) b. .col-xs-2 : 在超小屏幕中，占两列的宽(16.66%) c. .col-xs-12 : 在超小屏幕中，占 12 列的宽(100%) B. .col-sm-*：在小型屏幕中 所占列宽数 C. .col-md-*：在中型屏幕中 所占列宽数 D. .col-lg-*： 在大型屏幕中 所占列宽数 ⑤. Less 和 Bootstrap 定制 样式语言的分类有分两种 (1).
我们提供了两个此作用的类。 .mdui-container 类占据 92% - 96% 的屏幕宽度，且最大宽度 1280px。 这句话什么意思呢，就是一整个屏幕，其宽度可以放得下12列的东西，比如说，我用 两次，就可以得到双栏，同理，用col-xs-4三次，就可以得到三栏 -- 在超小屏幕设备上，第一列 100% 宽度，第二列 50% 宽度。在小屏幕及以上设备上，第一列为 66.6% 宽度，第二列为 33.3% 宽度。 -- 在超小屏幕设备上每列都是 50% 宽度，在小屏幕及以上设备上每列 33.3% 宽度。 偏移：2列 ? 官方示范： ? 举个合适的例子，我们想让右边的方块向左移动两列，以沾满12列 ? 这样就可以了！ ?
二、百分比法. 一般的百分比都是给宽度设置百分比. 高度 自动.或者定高.一个固定的数值.如果 高度也可以百分比话.就太好 了. 可惜div 默认是没有高度的. 如果屏幕尺寸变小了. html的font-size 也跟着变小. 那么你的图片也跟着等比例变小. 推理下去,有点令人吃惊. html的font-size 一般要 = 750px 了. 但是实际使用中最好用的还是 1px = 1rem 然后用javascript 根据屏幕的宽度动态计算html 的font-size 采用rem方法布局页面的话 切图的时候要注意, 一. 多用上下布局.左右布局最多不能超过3列. 超过3列的,应该考虑把多的那一列放到内容里水平显示. 五是. 想不到了. 这个单位是屏幕的物理尺寸。各种手机都进行过自动把1mm转换成对应的px。 因为屏幕质量不一样。好的屏幕在1mm的地方可以放下10个像素。 差的屏幕1mm只能放3个像素。用放大镜看就会看出来。
1、起步 1、<html lang="zh-cn"> 2、视口 3、跨浏览器(IE)兼容性 <meta http-equiv="x-ua-compatible" content="IE=edge"> 4、Bootstrap.css文件 5、两个兼容性JS文件 1、html5shiv.min.js 2、respond.min.js class(xs/sm/md/lg)，可以兼容更大的屏幕 小屏幕的class 可以兼容大屏幕的显示效果 col-xs-6 : 在 xs 屏幕下，占6列的宽 大屏幕的内容class是不能兼容小屏幕的，所以大屏幕的内容放在小屏幕中都是以 100%的宽度显示的（纵向排列） 3、可以在一个列(div)中，指定在不同屏幕下的宽度占比 <div 在md中占3列的宽(1行中能显示4列) 4、指定列在特定屏幕下隐藏 .hidden-lg : 在 lg 屏幕下隐藏 .hidden-md : 在 md 屏幕下隐藏
安装方法2：(懒人办法，最简单) 直接省略上面的步骤 按https://www.vpser.net/manage/centos-rhel-linux-third-party-source-epel.html 中间的<= =>这两个左右箭头，表示的是流量的方向。 ，输入要过滤的字符，比如ip,按回车后，屏幕就只显示这个IP相关的流量信息; 按L切换显示画面上边的刻度;刻度不同，流量图形条会有变化; 按j或按k可以向上或向下滚动屏幕显示的连接记录; 按1或2或3可以根据右侧显示的三列流量数据进行排序 4.2 iftop的输出从整体上可以分为三大部分： 第一部分是iftop输出中最上面的一行，此行是流量刻度，用于显示网卡带宽流量； 第二部分是iftop输出中最大的一个部分，此部分又分为左中右三列 其中中列的 => 代表发送数据，<=代表接收数据，通过这个指示箭头可以很清晰的知道两个IP之间的通信情况。最右列又分为三个小列，这些实时参数分别表示外部IP连接到本机2s 10s和40s的平均流量。
实时音视频（Tencent RTC）主打低延时互动直播和多人音视频两大解决方案，支持低延时直播观看、实时录制、屏幕分享、美颜特效、立体声等能力，还能和直播 CDN 无缝对接，适用于互动连麦、跨房PK、语音电台、K 歌、小班课、大班课、语音聊天、视频聊天、在线会议等业务场景。
扫码关注腾讯云开发者
领取腾讯云代金券
云服务器
网站备案
文件存储
命令行工具
SSL 证书
