IT入门 > 教程 > CSS3 >

CSS align-self 属性

实例 居中对齐弹性对象元素内的某个项： #myBlueDiv{ align-self:center;} 尝试一下 » 浏览器支持 表格中的数字表示支持该属性的第一个浏览器的版本号。 紧跟在 -webkit-, -ms- 或 -moz- 后的数字...

CSS flex 属性

实例 让所有弹性盒模型对象的子元素都有相同的长度，且忽略它们内部的内容： #main div{ flex:1;} 尝试一下 » 浏览器支持 表格中的数字表示支持该属性的第一个浏览器的版本号。 紧跟在...

CSS gap 属性

实例 设置网格行与列之间的间隙： .grid-container { gap: 50px;} 尝试一下 » 浏览器支持 表格中的数字表示支持该属性的第一个浏览器版本号。 属性 gap (多列中) 66 16 61 Not supported 53 gap (网格...

CSS grid 属性

实例 制作一个三列网格布局，并设置第一行高度为 160 像素： .grid-container { display: grid; grid: 160px / auto auto auto;} 尝试一下 » 标签定义及使用说明 grid 是一个 CSS 所有网格容器的简写属性...

CSS grid-area 属性

实例 以下实例设置 "item8" 从第 2 行开始和第 1 列开始， 横跨 2 行 3 列： .item8 { grid-area: 2 / 1 / span 2 / span 3;} 尝试一下 » 浏览器支持 表格中的数字表示支持该属性的第一个浏览器版本号...

CSS grid-auto-columns 属性

实例 设置网格中列的默认大小：： .grid-container { display: grid; grid-auto-columns: 50px;} 尝试一下 » 浏览器支持 表格中的数字表示支持该属性的第一个浏览器版本号。 属性 grid-auto-columns 57 1...

CSS grid-auto-flow 属性

实例 逐列插入网格元素： .grid-container { display: grid; grid-auto-flow: column;} 尝试一下 » 浏览器支持 表格中的数字表示支持该属性的第一个浏览器版本号。 属性 grid-auto-flow 57 16 52 10 44 属性定...

CSS grid-auto-rows 属性

实例 设置网格中行的默认大小：： .grid-container { display: grid; grid-auto-rows: 150px;} 尝试一下 » 浏览器支持 表格中的数字表示支持该属性的第一个浏览器版本号。 属性 grid-auto-rows 57 16 52...

CSS grid-column 属性

实例 设置 "item1" 在第 1 列开始，在第 5 列前结束： .item1 { grid-column: 1 / 5;} 尝试一下 » 浏览器支持 表格中的数字表示支持该属性的第一个浏览器版本号。 属性 grid-column 57 16 52 10 44 属性...

CSS grid-column-end 属性

实例 设置 "item1" 跨越 3 列： .item1 { grid-column-end: span 3;} 尝试一下 » 浏览器支持 表格中的数字表示支持该属性的第一个浏览器版本号。 属性 grid-column-end 57 16 52 10 44 属性定义及使用说明...