学习下DIV+CSS网页结构技能实例3：设置层的通明度

只看该作者 · 发表于 2015-1-16 10:40:19

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

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

x

可以用display:inline的方法让两个子div并排,但是这样的话div的宽度设置将会失效（要把子div撑大只能考里面的元素）。偶然候我们必要用到层的通明度，把下边的背景显露出来，以下图：

登录/注册后可看大图

这类半通明的情势在blog上使用对照普遍，那末这类效果是怎样做出来的呢？用JS，NO,NO，既然我们是CSS结构教程，那末就只管用CSS来办理成绩！

filter:alpha(opacity=70);
opacity:0.7;

把这两句代码到场到要完成半通明层的CSS款式内外便可，复杂吧！！
注：70和0.7的值可改成你必要的
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlxmlns="http://www.w3.org/1999/xhtml"><head><metahttp-equiv="Content-Type"content="text/html;charset=gb2312"/><title>尺度之路www.ckuyun.com——div层半通明效果</title><style>body{background:url(/upfile/images/bg.jpg)}#layout{position:absolute;top:50px;left:50px;width:500px;height:500px;border:1pxsolid#006699;background:#fff;filter:alpha(opacity=70);opacity:0.7;}</style></head><body><divid="layout"></div></body></html>
尺度之路www.ckuyun.com提醒：能够先修正部分代码后再运转
说实话，我并不是反对div+css，但物生一利，必生一弊，div+css的利处大家说了很多，我就说说狂热的追求div+css的几个弊端：

只看该作者 · 发表于 2015-1-18 07:46:41

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

只看该作者 · 发表于 2015-2-4 17:28:40

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

只看该作者 · 发表于 2015-2-10 05:10:51

Dreamweaver在所见即所得添加链接时，可以在选中文字后在属性栏中的链接栏中直接输入文件的地址即可。

只看该作者 · 发表于 2015-2-28 21:21:57

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

只看该作者 · 发表于 2015-3-10 08:32:44

在刚开始接触网页的第一堂课上，听说网页制作会是一门很无聊并且很难听懂的过程，而事实却印证了这样一个事实。

只看该作者 · 发表于 2015-3-17 06:12:30

Dreamweaver由MX版本开始使用Opera软件公司的排版引擎“Presto”作为网页预览。

只看该作者 · 发表于 2015-3-24 00:57:59

Dreamweaver在所见即所得添加链接时，可以在选中文字后在属性栏中的链接栏中直接输入文件的地址即可。

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

[DIV+CSS] 学习下DIV+CSS网页结构技能实例3：设置层的通明度

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

相关帖子