对于背景属性background-image大家应该已经很熟悉了,在CSS2中与它相关的属性还有background-repeat(设置背景是否重复及重复的方式).background-position(设置背景图片在容器中的位置).background-attachment(设置背景是否随页面一起滚动),通过这些属性来控制背景图片在容器中如何显示,但我们也只能为容器提供一张背景图片,如果我们想让一个容器的背景用多张图片实现,那么我们该如何去做呢?再在容器里添加一些无用的元素吗? CSS3的诞生…

语法缩写如下: background : [background-color] | [background-image] | [background-position][/background-size] | [background-repeat] | [background-attachment] | [background-clip] | [background-origin],... 注意:用逗号隔开每组background的缩写值:如果有size值,需要紧跟position并且用"/&q…

一.多重背景图片 ①CSS3允许我们在一个元素上添加多个图片 ②多重背景可以把多个图片资源添加到background属性上,用逗号隔开,然后用background-position把他们定位到你想要的位置 <div class="box"></div> .box{ width: 600px; height: 200px; border: 1px solid #000; background: url('1.jpg') no-repeat,url('2.jpg')…

multiple backgrounds 多重背景,也就是CSS2里background的属性外加origin.clip和size组成的新background的多次叠加,缩写时为用逗号隔开的每组值:用分解写法时,如果有多个背景图片,而其他属性只有一个(例如background-repeat只有一个),表明所有背景图片应用该属性值. 语法缩写如下: background : [background-color] | [background-image] | [background-position…

自开了博客园已经有2周了吧,虽然转载了一些觉得比较有用的文章之外还没有开始写自己的一些学习记录,那就从今天开始. 目前看了妙味的不少视频,有css+html,js的基础和中级也都看完了,作业也都做了,css3的部分也看过了,但是觉得讲得不太好,全部都是点到为止.无意中找到了传智播客的视频讲了一些css3的小技巧,今天就写一下用CSS3做网页中的小三角. 大致网上关于小三角的做法无非三种: 直接用背景图片,这个没什么好说的: 用块元素设置宽高都为0,三角的高用一条边框宽度,其他三条边框用dashe…

css3背景 1. background-size 2. background-origin 3. background-clip 示例: className { background:url(bg_flower.gif); -moz-background-size:63px 100px; /* 老版本的 Firefox */ background-size:63px 100px; background-repeat:no-repeat; } 你指定的大小是相对于父元素的宽度和高度的百分比的大小…

第12章   CSS3+HTML5网页排版 [学习重点] 正确使用HTML5结构标签 正确使用HTML5语义元素 能够设计符合标准的网页结构 12.1  使用结构标签 在制作网页时,不仅需要使用<div>标签来构建网页,还要使用下面几类标签完善网页结构: <h1>.<h2>.<h3>.<h4>.<h5>.<h6>:定义文档标题: <p>:定义段落文本: <ul>.<ol>.<li&…

css3新增属性 边框属性 背景属性 文字属性 颜色属性 背景属性 属性 说明 background-image 添加背景图片 background-size 指定背景图像的大小 background-origin 指定背景图像的位置区域 background-clip 指定位置开始裁剪背景图 1. background-image(背景图片) CSS3中可以通过background-image属性添加背景图片 语法:background-image:url('图片地址') 注意:不同的背景图像…

背景原点:background-origin 图片起始位置 border-box包括边框 padding-box边框内 content-box 内容内 **background-repeat 为no-repeat才有效 背景显示区域background-clip 超过部分被裁剪,属性同上 背景尺寸background-size 设置背景大小,auto原图片大小,可以是数值或百分比( 表示长宽) cover缩放至能覆盖整个容器 contain缩放至某一边能覆盖容器 **多重背景格式backgrou…

书本:<CSS3专业网页开发指南>(the book of css3) Peter Gasston 著    李景媛 吴晓嘉 译 第1章: 1.box-sizing : IE8及以上版本 box-sizing: content-box;//width || height = content box-sizing:border-box;//width || height = content+padding+border -moz-box-sizing:padding-box;//火狐专用,wid…