仓酷云

 找回密码
 立即注册
搜索
热搜: 活动 交友 discuz
查看: 796|回复: 8
打印 上一主题 下一主题

[DIV+CSS] 来看看:CSS3教程(5):网页背景图片

[复制链接]
莫相离 该用户已被删除
跳转到指定楼层
楼主
发表于 2015-1-16 00:03:21 | 只看该作者 回帖奖励 |倒序浏览 |阅读模式

马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。

您需要 登录 才可以下载或查看,没有帐号?立即注册

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

  1. #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;
我们能够在一行代码中实验安排多个分歧的图片…
多背景图

  1. #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)
老尸 该用户已被删除
5#
发表于 2015-2-11 07:00:52 | 只看该作者
我深感到交流的重要。善于交流的人才是善于学习的人。在整个技术的学习过程中,我总结了四大定律:兴趣、恒心、虚心、时间。
不帅 该用户已被删除
6#
发表于 2015-3-2 00:29:03 | 只看该作者
HTML技术的不断发展和完善,随之而产生了众多网页编辑器,从网页编辑器基本性质可以分为所见即所得网页编辑器和非所见即所得网页编辑器(则原始代码编辑器)
若天明 该用户已被删除
7#
发表于 2015-3-11 03:26:02 | 只看该作者
经过两天的学习,总算对Dreamweaver有进一步的了解了,心中不免有些激动。今天和其他几位老师交流了一下,感觉受益匪浅.
爱飞 该用户已被删除
8#
发表于 2015-3-17 20:10:40 | 只看该作者
使用内容管理系统进行开发并实现快速、精确的浏览器兼容性测试。
蒙在股里 该用户已被删除
9#
发表于 2015-3-25 02:01:20 | 只看该作者
HTML技术的不断发展和完善,随之而产生了众多网页编辑器,从网页编辑器基本性质可以分为所见即所得网页编辑器和非所见即所得网页编辑器(则原始代码编辑器)
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

QQ|Archiver|手机版|仓酷云 鄂ICP备14007578号-2

GMT+8, 2024-4-26 01:35

Powered by Discuz! X3.2

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表