莫相离 发表于 2015-1-16 00:03:21

来看看:CSS3教程(5):网页背景图片

Div全称division意为“区分”使用DIV的方法跟使用其他tag的方法一样。
背景图片/纹理有良多种利用体例,经常用于增加网站的最好的终极丑化。如今它在CSS3中被器重,我们能够使用多背景图和背景图片尺寸来完成更完善的效果。
上一篇文章:CSS3教程(4):网页边框和网页笔墨暗影
CSS3的背景图片巨细能够写成background-size:ApxBpx;
-Apx=x轴(图片宽度)
-Bpx=y轴(图片高度)
懂得了这些,我们入手下手体验这个特征吧:
最好撑持CSS3背景巨细的扫瞄器是Safari和Opera,以是我们只必要利用-o和-webkit前缀。
背景巨细


#backgroundSize{border:5pxsolid#bd9ec4;background:url(image_1.extention)bottomrightno-repeat;-o-background-size:150px250px;-webkit-background-size:150px250px;padding:15px25px;height:inherit;width:590px;}扫瞄器撑持:


[*]Firefox(3.05+…)
[*]GoogleChrome(1.0.154+…)
[*]GoogleChrome(2.0.156+…)
[*]InternetExplorer(IE7,IE8RC1)
[*]Opera(9.6+…)
[*]Safari(3.2.1+windows…)
为了在CSS3中使用多背景图片,我们利用都好离隔,比方:
background:url(image_1.extention)toprightno-repeat,url(image_2.extention)bottomrightno-repeat;
我们能够在一行代码中实验安排多个分歧的图片…
多背景图


#backgroundMultiple{border:5pxsolid#9e9aab;background:url(image_1.extention)topleftno-repeat,url(image_2.extention)bottomleftno-repeat,url(image_3.extention)bottomrightno-repeat;padding:15px25px;height:inherit;width:590px;}扫瞄器撑持:


[*]Firefox(3.05+…)
[*]GoogleChrome(1.0.154+…)
[*]GoogleChrome(2.0.156+…)
[*]InternetExplorer(IE7,IE8RC1)
[*]Opera(9.6+…)
[*]Safari(3.2.1+windows…)

一个样式规则由一个选择器后跟一个声明块组成,声明块是一个大容器,由大括号中间的部分组成,声明块中间的空间会被忽略。

灵魂腐蚀 发表于 2015-1-18 05:00:23

难以逾越的障碍会大大打击你的学习积极性。这就需要你的恒心,坚持不懈的决心。在自己无法解决某些问题时,就需要虚心请教别人.

小女巫 发表于 2015-1-27 05:04:18

由CS4 版本开始,则转用WebKit 排版引擎(亦即Google Chrome和Apple Safari浏览器所用的排版引擎)作为网页预览。

兰色精灵 发表于 2015-2-5 05:20:16

滚动条)层属性--溢出(visible/hidden/scroll/auto)

老尸 发表于 2015-2-11 07:00:52

我深感到交流的重要。善于交流的人才是善于学习的人。在整个技术的学习过程中,我总结了四大定律:兴趣、恒心、虚心、时间。

不帅 发表于 2015-3-2 00:29:03

HTML技术的不断发展和完善,随之而产生了众多网页编辑器,从网页编辑器基本性质可以分为所见即所得网页编辑器和非所见即所得网页编辑器(则原始代码编辑器)

若天明 发表于 2015-3-11 03:26:02

经过两天的学习,总算对Dreamweaver有进一步的了解了,心中不免有些激动。今天和其他几位老师交流了一下,感觉受益匪浅.

爱飞 发表于 2015-3-17 20:10:40

使用内容管理系统进行开发并实现快速、精确的浏览器兼容性测试。

蒙在股里 发表于 2015-3-25 02:01:20

HTML技术的不断发展和完善,随之而产生了众多网页编辑器,从网页编辑器基本性质可以分为所见即所得网页编辑器和非所见即所得网页编辑器(则原始代码编辑器)
页: [1]
查看完整版本: 来看看:CSS3教程(5):网页背景图片