当前位置: 网站建设 > 网页设计 > 建站经验 >

CSS3中背景的四个新的属性

时间:2013-03-02 03:42来源:未知 作者:admin 点击:

标签:CSS3中背景的四个新的属性 新的(5)CSS3(90)一个(102)背景(35)四个(10)元素(40)属性(68)可以(28)
Css3中,对一个元素可以使用一张以上的背景图片。除了使用逗号将图片离开以外,其代码与css2雷同。第一个申明的图片定位在元素的顶部, CSS3下的渐变文字效果实现 ,接下来的图片层列于下,像这样: Background Break 1.background-image: url(top-image.jpg)
CSS3中背景的四个新的属性》文章地址:http://www.tfxk.com/wangyesheji/jianzhanjingyan/0302332022013.htm

Css3中,对一个元素可以使用一张以上的背景图片。除了使用逗号将图片离开以外,其代码与css2雷同。第一个申明的图片定位在元素的顶部,CSS3下的渐变文字效果实现,接下来的图片层列于下,像这样:

Background Break

1.background-image: url(top-image.jpg), url(middle-image.jpg), url(bottom-image.jpg);

转变Background Repeat

background-size常用来调剂背景图片的大小,有以下可能的属性:

background-attachment 有一个可能的属性值:local。它通常与能滚动的元素(如:overflow:scroll)一起施展作用。当background-attachment 为scroll时,元素内容滚动时背景图片不会滚动。background-attachment为local时,元素内容转动时背景图片会随着滚动。

改变background-color

background-origin: border-box;从border.开始计算background-position; background-origin: padding-box;从padding.开始计算background-position; background-origin: content-box;从content,Css3 弹性盒模型.开始计算background-position,CSS3 VS CSS2大PK;

在css2中,CSS3 Transition属性详解,当图片反复时,它常常在元素的底部堵截。Css3引入两个新的属性修复它。

Tag:属性   背景   CSS3   属性  ,CSS3 target伪类简单介绍; 背景   CSS3  

该属断定背景画区,有以下多少种可能的属性:

background-size: contain;缩小图片以适合元素(维持像素长宽比),CSS3 RGBA颜色类型不等于RGB与opacity相加; background-size: cover;扩大元素以弥补元素(保持像素长宽比) background-size: 100px 100px;缩小图片至指定的大小. background-size: 50% 100%;缩小图片至指定的大小,百分比是绝对包括元素的尺寸. background-clip: border-box;背景从border开始显示; lbackground-clip: padding-box;背景从padding开端显示; background-clip: content-box,CSS3 Media Queries详解;背景显从content取与开始显示; background-clip: no-clip;默认属性,等同于border-box; space:等量的空白运用到图像块之间直到填满元素。 round:图片缩小直到合适元素。

Background Clip

改变Background Attachment

Background Origin

多重背景图片

Css3中,CSS3 Gradient 创建水晶按钮实例,元素可以被宰割成单个的盒子(例如,使一个内联的span元素多行排列),background-break 属性把持背景逾越多个盒子如何显示。

它通常与background-position结合应用,你能够从border、padding、content来盘算background-position(就像background-clip)。

Background Size

本文对CSS3中背景的四个新的属性进行了具体先容。

--> [网站建设之]CSS3中背景的四个新的属性

在这个例子中,背景色彩为green。然而,假如最底层的图片不能使用,背景颜色将是blue。如果没有定义颜色,就假设是透明的(transparent)。

Background-break: continuous;;默认值,css3 border-image使用说明。盒子之间似乎不空缺(好似它们在一个盒子当中,背景图片利用到盒子之上),CSS11个class与一个id谁的优先级高。 Background-break: bounding-box;将空白斟酌进去。 Background-break: each-box;将每个盒子独自处置,对每一个重绘背景。

Css3对背景颜色有稍微的增强,除了定义背景颜色之外,你还可以定义一个备用颜色,它在元素最底层的图片不能使用时得以生效。如:

1.background-color: green / blue;
(责任编辑:网站建设)
CSS3中背景的四个新的属性相关文章
上一篇:CSS3下的渐变文字效果实现 下一篇:CSS3入门教程(1):CSS3简介
回到顶部