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=" ...
随机推荐
- 《一课经济学》书摘笔记IV
有出口,才有钱进口:没有进口,就没有机会出口,因为外国人没有美元可以用来买美国的产品.要想扩大出口,就必须有更多的进口,否则收不到货款.要想压缩进口,出口也会随之被压缩.所以,当我们决定减少进口的时候 ...
- [ActionScript 3.0] AS3 用于拖动对象时跟随鼠标的缓动效果
package com.fylibs.components.effects { import flash.display.DisplayObject; import flash.events.Even ...
- javascript 传递引用类型参数
JavaScript代码如下: function setName(obj){ obj.name = "test1"; obj = new Object(); obj.name = ...
- DISTINCT后按照DISTINCT之前的某列进行排序
SELECT 行业名称 FROM 评分标准 GROUP BY 行业名称 ORDER BY MAX(行业ID) DESC
- [DataTable]C# datatable取最大值最小值
ArrayList al = new ArrayList(); DataTable dt = new DataTable(); dt.Columns.Add("A",typeof( ...
- using inno setup uninstall default icon
If you set SetupIconFile then the Uninstall Exe File (e.g. unins000.exe) will have exactly same icon ...
- mysql information_schema
SELECT TABLE_NAME,COLUMN_NAME,CHARACTER_MAXIMUM_LENGTH,COLUMN_COMMENT FROM COLUMNS WHERE TABLE_SCHEM ...
- OC基础(16)
autorelease基本使用 autorelease注意事项 *:first-child { margin-top: 0 !important; } body > *:last-child { ...
- OC基础(5)
#pragma mark指令 description方法 OC多文件开发介绍 *:first-child { margin-top: 0 !important; } body > *:last- ...
- Codeforces Round #218 (Div. 2) D. Vessels
D. Vessels time limit per test 2 seconds memory limit per test 256 megabytes input standard input ou ...