css3 column-rule用法
css3 column-rule用法:
column-rule属性用来规定列与列之间的边框样式，有点类似于border属性。但是和border不同的是，它只作用于两列之间的位置，并且不占用任何空间。
语法结构:
column-rule:<column-rule-width> || <column-rule-style> || <column-rule-color>
此属性是一个复合属性。
参数解析:
（1）.column-rule-width:规定边框的宽度，默认值是medium”。
（2）.column-rule-style:规定边框的样式，其默认值为“none”。
（3）.column-rule-color:规定边框的颜色，其默认值为前景色color的值，可以设置其为透明。
浏览器支持:
（1）.IE10和IE10以上浏览器支持此属性。
（2）.谷歌浏览器支持此属性。
（3）.火狐浏览器支持此属性。
（4）.opera浏览器支持此属性。
（5）.Safari浏览器支持此属性。
特别说明:
火狐浏览器需要加 -moz-前缀。
谷歌和Safari浏览器需要添加-webkit-前缀。
代码实例:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="author" content="//m.sbmmt.com/" />
<title>php中文网</title>
<style type="text/css">
.columns {
border: 1px solid green;
width: 600px;
margin: 20px auto;
-webkit-column-count:2;
-moz-column-count:2;
column-count:2;
-moz-column-rule: 2px solid blue;
-webkit-column-rule: 2px solid blue;
column-rule: 2px solid blue;
}
</style>
</head>
<body>
<div class="columns">
互联网的出现，极大的促进了信息的交流，随着步伐的前进，网站的交互需求越来越多，但是受限于当时的软硬件条件，
特别是网络环境的限制，非常简单的表单验证都要花费大量的时间在服务器与客户端之间进行传输，
后来改名为JavaScript。随着JavaScript在互联网上的成功运用，微软公司也随之开发了自己的"JavaScript"名叫JScript，
于是在互联网上就出现多种标准的"JavaScript"脚本语言，如果任其发展下去，那么将会严重影响互联网发展，
于是标准化迫在眉睫。最后JavaScript被提交给提交给欧洲计算机制造商协会（ECMA），
并最终推出了ECMA-262标准，定义了名为ECMAScript的脚本语言，从此以后浏览器都将ECMAScript作为JavaScript的实现基础。
</div>
</body>
</html>上面的代码设置两列之间边框的相关样式。
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="author" content="//m.sbmmt.com/" />
<title>php中文网</title>
<style type="text/css">
.columns {
border: 1px solid green;
width: 600px;
margin: 20px auto;
-webkit-column-count:2;
-moz-column-count:2;
column-count:2;
-moz-column-rule: 40px solid blue;
-webkit-column-rule: 40px solid blue;
column-rule: 40px solid blue;
}
</style>
</head>
<body>
<div class="columns">
互联网的出现，极大的促进了信息的交流，随着步伐的前进，网站的交互需求越来越多，但是受限于当时的软硬件条件，
特别是网络环境的限制，非常简单的表单验证都要花费大量的时间在服务器与客户端之间进行传输，
后来改名为JavaScript。随着JavaScript在互联网上的成功运用，微软公司也随之开发了自己的"JavaScript"名叫JScript，
于是在互联网上就出现多种标准的"JavaScript"脚本语言，如果任其发展下去，那么将会严重影响互联网发展，
于是标准化迫在眉睫。最后JavaScript被提交给提交给欧洲计算机制造商协会（ECMA），
并最终推出了ECMA-262标准，定义了名为ECMAScript的脚本语言，从此以后浏览器都将ECMAScript作为JavaScript的实现基础。
</div>
</body>
</html>此边框不占据任何的空间，也可以随意向两端扩展，并不会改变其他相关属性。
![Front-End-Projekt-Shangyou [umfassende Praxis der HTML/CSS/JS-Technologie]](https://img.php.cn/upload/course/000/000/068/63bfcb2974f91471.jpg)
![Nullbasierter Front-End-Kurs [Vue fortgeschrittenes Lernen und praktische Anwendung]](https://img.php.cn/upload/course/000/000/068/63bbd15353895588.jpg)
![WEB-Frontend-Tutorial [HTML5+CSS3+JS]](https://img.php.cn/upload/course/000/000/068/63ba60c8da520536.jpg)
![Praktische Anwendung von Apipost [API, Schnittstelle, automatisiertes Testen, Mock]](https://img.php.cn/upload/course/000/000/068/63b3c967a20f4861.jpg)
