<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>CSS3 多列</title>
<style>
div.newspaper{
-moz-column-count: 3;
-webkit-column-count: 3;
column-count: 3;
}
div.newspaper1{
-moz-column-count: 3;
-webkit-column-count: 3;
column-count: 3;
-moz-column-gap: 40px;
-webkit-column-gap: 40px;
column-gap: 40px;
}
div.newspaper2{
column-count: 3;
column-gap: 40px;
column-rule-style: dotted;
-moz-column-count: 3;
-moz-column-gap: 40px;
-moz-column-rule-style: dotted;
-webkit-column-count: 3;
-webkit-column-gap: 40px;
-webkit-column-rule-style: dotted;
}
div.newspaper3{
-webkit-column-count: 3;
-webkit-column-gap: 40px;
-webkit-column-rule-style: outset;
-webkit-column-rule-width: 1px;
-moz-column-count: 3;
-moz-column-gap: 40px;
-moz-column-rule-style: outset;
-moz-column-width: 1px;
column-count: 3;
column-gap: 40px;
column-rule-style: outset;
column-rule-width: 1px;
}
div
CSS3多列布局属性
最新推荐文章于 2022-09-16 21:31:37 发布
本文详细介绍了CSS3中的多列布局属性,包括column-count、column-gap、column-rule系列属性,以及column-span和column-width的使用,帮助理解如何创建和控制多列布局。
摘要由CSDN通过智能技术生成