- 博客(3)
- 收藏
- 关注
原创 CSS弹性盒子
一、弹性盒子弹性盒子是 CSS3 的一种新的布局模式。引入弹性盒布局模型的目的:是提供一种更加有效的方式来对一个容器中的子元素进行排列、对齐和分 配空白空间兼容性: IE11+及标准浏览器最新版是支持的1、设置弹性盒子任何容器都可以指定为一个弹性盒子display: flex;display: inline-flex;以上两条属性需要加给容器以上两条属性需要加给容器注意:弹性容器外及弹性子元素内是正常渲染的。弹性盒子只定义了弹性子元素如何在弹性容器内布局设为Flex布局以后,子元素的
2021-01-09 18:33:10
2730
原创 CSS3多列布局和过渡效果
CSS3多列布局和过渡效果1、column-count属性定义栏目的数量column-count:number | autonumber 指定栏目的数量 auto 自动,如果设为auto,需要配合其他属性使用实现多列效2、column-width属性定义每一个栏目的宽column-width: length | autolength 指定每一栏的具体宽度 auto 自动3、column-gap属性指定列与列之间的间隔距离colum
2020-12-31 16:41:35
149
1
原创 css布局技巧
**css布局技巧*一、浮动与定位的对比脱离正常文档流的属性:浮动:左浮动和右浮动 定位:固定定位和绝对定位不同的地方:浮动会脱离正常文档流,但是不脱离文本流 定位既脱离正常文档流,也脱离文本流注意:设置了定位和浮动的元素不再区分块级元素、行级元素,都可以设置宽高和所有盒模型属性 所有元素都可以设置浮动和定位二、verticial-align属性设置垂直对齐方式,用在行级元素或者行块级元素身上,对于块级元素不生效常用属性值:baseline 基线对齐(默认值) top
2020-12-25 15:10:21
149
3
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人