一.三栏布局 1. 经典的圣杯布局(双飞翼布局) 2.绝对定位法 优点:三个div顺序可以任意变 缺点:top值要注意 3. 自身浮动 优点 页面影响小 缺点:center必须在最下面 4.css3新特性 flex 属性用于设置或检索弹性盒模型对象的子元素如何分配空间。 flex: flex-gro ...
分类:
Web程序 时间:
2018-05-10 20:00:50
阅读次数:
225
弹性盒模型flexBox 弹性盒模型是c3的一种新的布局模式 它是指一种当页面需要适应不同屏幕大小以及设备类型时,确保元素有恰当行为的布局方式。 引入弹性盒模型布局的目的是提供一种更有效的方法来对一个容器中的子元素进行排列、对齐和分配空白空间。 兼容性 IE11 弹性盒模型内容 弹性盒模型由弹性容器 ...
分类:
Web程序 时间:
2018-05-08 22:22:03
阅读次数:
225
CSS3被拆分为"模块"。旧规范已拆分成小块,还增加了新的。 一些最重要CSS3模块如下: 1.选择器(.基本选择器,层次选择器,伪类选择器,伪元素,属性选择器,通配符) 2.盒模型(弹性盒子) 3.背景和边框(边框:圆角 阴影边框图像 背景:background-size,多重背景 ) 4.文字特 ...
分类:
Web程序 时间:
2018-05-08 22:15:42
阅读次数:
249
弹性盒子定义弹性盒子 display:flex定义子元素排列方式 flex-diection定义子元素换行方式 flxe-wrap定义子元素对齐方式横向对齐 justify-content纵向对齐 align-items 媒体查询 @media screen and (max-width:最大宽度) ...
分类:
其他好文 时间:
2018-05-07 19:39:57
阅读次数:
165
1、 ionic 网格(Grid) ionic 的网格(Grid)和其他大部分框架有所不同,它采用了弹性盒子模型(Flexible Box Model) 。而且在移动端,基本上的手机都支持。row 样式指定行,col 样式指定列。 同等大小网格 在带有 row 的样式的元素里如果包含了 col 的样 ...
分类:
Web程序 时间:
2018-05-07 19:32:46
阅读次数:
371
一、弹性盒子 1、定义弹性盒子:在父级元素定义弹性盒子 display:flex 2、定义子元素的排列方式: flex-direction 3、定义子元素的换行方式: flex-wrap 4、定义子元素的对齐方式:①、横向对齐:justify-content ②、纵向对齐:align-intems ...
分类:
其他好文 时间:
2018-05-07 13:26:32
阅读次数:
153
1、文本实现在div中垂直居中 设置行高和高度一样即可实现。 2、弹性盒布局 CSS3 弹性盒( Flexible Box 或 flexbox),是一种当页面需要适应不同的屏幕大小以及设备类型时确保元素拥有恰当的行为的布局方式。弹性盒子由弹性容器(Flex container和弹性子元素(Flex ...
分类:
其他好文 时间:
2018-05-01 01:05:30
阅读次数:
166
1.谁是弹性盒,谁写(一般是父元素)Display:box 如果不兼容写:display:-moz-box Display:-webkit-box; Display:-o-box; Display:-ms-box; Display:box; 2.父元素决定子元素的排列方向 box-orient:ho ...
分类:
其他好文 时间:
2018-04-19 10:29:53
阅读次数:
2452
1· 【 html中自适应设置】:meta和script <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" /> 【和 ...
分类:
其他好文 时间:
2018-04-13 22:31:23
阅读次数:
159