CSS3 column-rule-style 属性
CSS column-rule-style属性用于在多列布局中指定列与列之间通过column rule属性设置的分隔线的样式。column-rule是列与列之间的一条垂直分隔线,你可以使用column-rule-width属性来设置分隔线的宽度,使用column-rule-color属性来设置分隔线的颜色,使用column-rule-style属性来设置分隔线的线条样式。
.浏览器支持
.语法
column-rule-style: none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset
.参数
- none:不显示列与列之间的分隔线。设置的分隔线宽度和颜色属性会被忽略。
- hidden:不显示列与列之间的分隔线。设置的分隔线宽度和颜色属性会被忽略。
- dotted:列之间的分隔线显示为圆角的矩形。圆角的半径等于分隔线宽度的一半。
- dashed:列之间的分隔线显示为直角矩形组成的虚线。
- solid:列之间的分隔线显示为一条笔直的直线。
- double:列之间的分隔线显示为两条直线,两条直线之间有一些间隙。两条直线的宽度和间隙宽度的总和等于column-rule-width属性指定的宽度。
- groove:列之间的分隔线显示为内陷浮雕效果。
- ridge:列之间的分隔线显示为外凸浮雕效果。
- inset:列之间的分隔线显示为内斜面效果。
- outset:列之间的分隔线显示为外斜面效果。
column-rule-style属性的初始值为none。
.应用范围
column-rule-style属性可以应用在所有多列布局的元素上。
在一个元素应用column-rule-style属性的代码如下
.columns { columns: 12em; column-rule-width: 5px; column-rule-style: solid; column-rule-color: #0099CC;} |
CSS3 column-rule-style 属性的更多相关文章
- CSS3 column属性
css3 column属性的应用 1.案例源码 <!DOCTYPE html><html lang="en"><head> <meta c ...
- 解决Struts2.2.20版本的标签不支持style属性的问题
我先把Exception错误信息贴出来:org.apache.jasper.JasperException: /WEB-INF/jsp/topicAction/addUI.jsp (line: 40, ...
- CSS3 新增的文本属性
一.CSS1&2中的文本属性(W3C标准) text-indent CSS1 检索或设置对象中的文本的缩进 letter-spacing CSS1 检索或设置对象中的文字之间的间隔 word- ...
- Selectivizr-让IE6~8支持CSS3伪类和属性选择器
一.下载和demo 下载: 您可以狠狠地点击这里:selectivizr-1.0.0.zip(右键-[目标|链接另存为] 9.24K) demo: 您可以狠狠地点击这里:Selectivizr部分属性 ...
- CSS3的新增边框属性
一.CSS3 新增的边框属性 属性 版本 简介 border-image CSS3 设置或检索对象的边框使用图像来填充 border-image-source CSS3 设置或检索对象的边框是否用图像 ...
- CSS3:布局display属性的flex(弹性布局)
CSS3:布局display属性的flex(弹性布局) 一.简介 Flex是Flexible Box的缩写,意为"弹性布局",用来为盒状模型提供最大的灵活性.设为Flex布局以后, ...
- CSS3 column 分栏
column的布局形式还没有使用过,后续的bug和解决方案有待检验. column column-count:number: 设置内容分为多少栏显示 column-width:长度单位:设置每一栏的 ...
- dede文章调用时过滤调 body里面的style属性和值
dede 发布文章的时候会在里面的标签中添加一些style 属性,现在改网站想去掉这些属性和里面的值,因为文章太多所以就用下面的方法 \include\arc.listview.class.php 在 ...
- css字体样式(Font Style),属性
css字体样式(Font Style),属性 css字体样式(Font Style)是网页中不可或缺的样式属性之一,有了字体样式,我们的网页才能变得更加美观,因此字体样式属性也就成为了每一位设计者 ...
- JS中style属性
解决办法:1.先定义一个CSS规则,然后this.className=''2.document.getElementByIdx_x("a").style.cssText=" ...
随机推荐
- [Flex] ButtonBar系列——flex3 皮肤和外观设置
<?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="h ...
- 山东省第四届ACM省赛
排名:http://acm.sdut.edu.cn/sd2012/2013.htm 解题报告:http://www.tuicool.com/articles/FnEZJb A.Rescue The P ...
- Oracle 的简单描述
在 Oracle 开发中,客户端把 SQL 语句发送给服务器,服务器对 SQL 语句进行编译.执行,把执行的结果返回给客户端. Oracle SQL 语句由如下命令组成: 数据定义语言( DDL) ...
- nyoj 79 导弹拦截
点击打开链接 拦截导弹 时间限制:3000 ms | 内存限制:65535 KB 难度:3 描述 某国为了防御敌国的导弹袭击,发展中一种导弹拦截系统.但是这种导弹拦截系统有一个缺陷:虽然它的第一发 ...
- POJ 1542 Atlantis(线段树 面积 并)
题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1542 参考网址:http://blog.csdn.net/sunmenggmail/article/d ...
- (转)C# 解析 json
原文: http://www.cnblogs.com/txw1958/archive/2012/08/01/csharp-json.html JSON(全称为JavaScript Object N ...
- jdk1.6官方下载地址
jdk1.6: http://www.oracle.com/technetwork/java/javasebusiness/downloads/java-archive-downloads-javas ...
- MySQL数据库优化技术之SQL语句慢查询定位
通过show status命令了解各种SQL的执行频率 MySQL客户端连接成功后,通过使用show [session|global] status 命令可以提供服务器状态信息: 其中的session ...
- Android框架 加载图片 库 Picasso 的使用简介
0 说明 现在Android开源库中有许多图片加载框架,本文以picasso为例,总结下开发过程中的一些优化经验,使用的picasso版本如下 compile 'com.squareup.picass ...
- FFTW库在VS 2010中的使用方法
一.FFTW库简介(from百度百科) FFTW ( the Faster Fourier Transform in the West) 是一个快速计算离散傅里叶变换的标准C语言程序集,其 ...