-
语法: columns:<column-width> || <column-count> 多列布局columns属性参数主要就两个属性参数:列宽和列数。 参数 参数说明 <column-width> 主要用来定义多列中每列的宽度 <column-count> 主要用来定义多列中的列数查看全部
-
语法: color:rgba(R,G,B,A) 以上R、G、B三个参数,正整数值的取值范围为:0 - 255。百分数值的取值范围为:0.0% - 100.0%。超出范围的数值将被截至其最接近的取值极限。并非所有浏览器都支持使用百分数值。A为透明度参数,取值在0~1之间,不可为负值。 代码示例: background-color:rgba(100,120,60,0.5);查看全部
-
外轮廓属性 outline: [outline-color] || [outline-style] || [outline-width] || [outline-offset] || inherit 从语法中可以看出outline和border边框属性的使用方法极其类似。outline-color相当于border-color、outline-style相当于border-style,而outline-width相当于border-width,只不过CSS3给outline属性增加了一个outline-offset属性,其取值说明如下。 属性值 属性值说明 outline-color 定义轮廓线的颜色,属性值为CSS中定义的颜色值。在实际应用中,可以将此参数省略,省略时此参数的默认值为黑色。 outline-style 定义轮廓线的样式,属性为CSS中定义线的样式。在实际应用中,可以将此参数省略,省略时此参数的默认值为none,省略后不对该轮廓线进行任何绘制。 outline-width 定义轮廓线的宽度,属性值可以为一个宽度值。在实际应用中,可以将此参数省略,省略时此参数的默认值为medium,表示绘制中等宽度的轮廓线。 outline-offset 定义轮廓边框的偏移位置的数值,此值可以取负数值。当此参数的值为正数值,表示轮廓边框向外偏离多少个像素;当此参数的值为负数值,表示轮廓边框向内偏移多少个像素。 inherit 元素继承父元素的outline效果。查看全部
-
form { border: 1px solid #ccc; padding: 20px; width: 300px; margin: 30px auto; } .wrapper { margin-bottom: 10px; } .box { display: inline-block; width: 30px; height: 30px; margin-right: 10px; position: relative; background: orange; vertical-align: middle; border-radius: 100%; } .box input { opacity: 0; position: absolute; top:0; left:0; width: 100%; height:100%; margin:0; } .box span { display: block; width: 10px; height: 10px; border-radius: 100%; position: absolute; background: #fff; top: 50%; left:50%; margin: -5px 0 0 -5px; } input[type="radio"] + span { display:none; } input[type="radio"]:checked + span { display:block; }查看全部
-
水平垂直居中查看全部
-
translate的百分比是相对于自身的宽高来定义的查看全部
-
color{rgba(255,255,255,0.5)};查看全部
-
设置背景图片的大小,以长度值或百分比显示. 语法:background-size: auto | <长度值> | <百分比> | cover | contain 取值说明: 1、auto:默认值,不改变背景图片的原始高度和宽度; 2、<长度值>:成对出现如200px 50px,将背景图片宽高依次设置为前面两个值,当设置一个值时,将其作为图片宽度值来等比缩放; 3、<百分比>:0%~100%之间的任何值,将背景图片宽高依次设置为所在元素宽高乘以前面百分比得出的数值,当设置一个值时同上; 4、cover:顾名思义为覆盖,即将背景图片等比缩放以填满整个容器; 5、contain:容纳,即将背景图片等比缩放至某一边紧贴容器边缘为止。查看全部
-
column-span主要用来定义一个分列元素中的子元素能跨列多少。 column-width、column-count等属性能让一元素分成多列,不管里面元素如何排放顺序,他们都是从左向右的放置内容,但有时我们需要基中一段内容或一个标题不进行分列,也就是横跨所有列,此时column-span就可以轻松实现,此属性的语法如下。 column-span: none | all查看全部
-
将背景图片做适当的裁剪以适应实际需要。 语法:background-clip : border-box | padding-box | content-box | no-clip; 参数分别表示从边框、或内填充,或者内容区域向外裁剪背景。no-clip表示不裁切。查看全部
-
语法:text-shadow: X-Offset Y-Offset blur color; X-Offset:表示阴影的水平偏移距离,其值为正值时阴影向右偏移,反之向左偏移; Y-Offset:是指阴影的垂直偏移距离,如果其值是正值时,阴影向下偏移,反之向上偏移;查看全部
-
语法:@font-face { font-family : 字体名称; src : 字体文件在服务器上的相对或绝对路径;} 用法:p { font-size :12px; font-family : "My Font"; /*必须项,设置@font-face中font-family同样的值*/}查看全部
-
1.溢出文本显示省略号:text-overflow:ellipsis(表示显示省略标记)|clip(表示剪切); overflow:hidden; white-space:nowrap; 2.判断当前行超过指定容器的边界时是否断开转行:word-wrap:normal(表示控制连续文本换行) | break-word(表示内容将在边界内换行); 3.break-word设置在长单词或 URL地址内部进行换行,此属性不常用,用浏览器默认值即可。查看全部
-
Gradient分为线性渐变(linear)和径向渐变(radial)。 语法:background-image:linear-gradient(to left, red, orange,yellow,green,blue,indigo,violet);查看全部
-
语法:color:rgba(R,G,B,A);background-color:rgba(100,120,60,0.5); A为透明度参数,取值在0~1之间,不可为负值。查看全部
举报
0/150
提交
取消