CSS教程之CSS3实例教程:盒模子增加暗影属性box-shadow

只看该作者 · 发表于 2015-1-15 22:58:36

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

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

x

对相应的代码做一些简单的修改，就可以改变同一页面的不同部分，或者页数不同的网页的外观和格式。
破洛洛文章简介：我们要对盒模子增加暗影怎样办呢？实在它的用法与text-shadow用法一样，只不外属性称号是box-shadow。
我们要对盒模子增加暗影怎样办呢？实在它的用法与text-shadow用法一样，只不外属性称号是box-shadow。

相干文章：CSS3教程:网页笔墨暗影属性text-shadow

box-shadow：
　　此属性与text-shadow一样有4个值，前两个值分离暗示程度偏向位移间隔和垂直偏向的位移间隔，第三个值暗示暗影的含混半径（包括0及以下的值均暗示无含混），最初一个则是暗影的色彩。
【注】今朝Chrome16+，FireFox8+，Opera11.6+，Safari5.1+和IE9+都可间接利用box-shadow，而不必要-webkit-诸云云类的前缀！其他低版本的扫瞄器没有做测试，次备注只作为参考。

<!DOCTYPEHTML>

<html>

<head>

<metacharset="gb2312">

<title>CSS3实例教程:盒模子增加暗影属性box-shadow-网页教授教养网poluoluo.Com</title>

<styletype="text/css">

*{margin:0;padding:0;}

body{padding-top:25px;font-size:14px;color:#333;font-family:"MicrosoftYahei";background:#eee;}

h2,p{display:block;margin:0auto;width:600px;line-height:24px;background:#fff;box-shadow:-5px5px5px#999;}

h2{margin-bottom:10px;height:30px;}

</style>

</head>

<body>

<h2>网页教授教养网poluoluo.Com</h2>

<p>网页教授教养网供应最新的网页制造、网页计划、网页殊效，为团体网站供应网页素材模板和网页视频进修！</p>

</body>

</html>

</p>
每个声明内只能有一个属性，如果属性值中含有空格用双引号括起来例，在一个声明块内可以有多个声明，每个声明用分号隔开。

只看该作者 · 发表于 2015-1-17 20:05:06

您在所见即所得网页编辑器进行网页制作和在WORD中进行文本编辑不会感到有什么区别，但它同时也存在着致命的弱点。

只看该作者 · 发表于 2015-1-26 22:27:49

Dreamweaver8中文版(dw)是由Macromedia公司开发的一款所见即所得的网页编辑器。和二维动画设计软件FLASH，专业网页图像设计软件FIREWORKS，并称为“网页三剑客”。

只看该作者 · 发表于 2015-2-5 05:12:57

时间轴)窗口--时间轴--选中图层并拖图层到时间轴,将其放在指定帧上

只看该作者 · 发表于 2015-2-11 06:49:51

使用所见即所得的接口，亦有HTML编辑的功能。它现在有Mac和Windows系统的版本。原本由Macromedia公司所开发。

只看该作者 · 发表于 2015-3-2 00:28:31

Dreamweaver8中文版(dw)是由Macromedia公司开发的一款所见即所得的网页编辑器。和二维动画设计软件FLASH，专业网页图像设计软件FIREWORKS，并称为“网页三剑客”。

只看该作者 · 发表于 2015-3-11 03:35:34

时间轴)窗口--时间轴--选中图层并拖图层到时间轴,将其放在指定帧上

只看该作者 · 发表于 2015-3-17 21:11:43

dreamweaver8中文版下载(dw)对专业网页图像设计的FIREWORKS，三者被MACROMEDIA公司称为DREAMTEAM(梦之队)。

只看该作者 · 发表于 2015-3-25 06:50:22

俗话说：兴趣是最好的老师。做每一件事都离不开兴趣的驱动。兴趣是自学技术需要迈出的第一步。在学习的过程中，我们难免会遇到各种各样的问题。

		自动登录	找回密码
密码			立即注册

[DIV+CSS] CSS教程之CSS3实例教程:盒模子增加暗影属性box-shadow

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

相关帖子