仓酷云

标题: 今天来学习尺度的DIV布局纯CSS Lightbox黑屏遮挡窗口效果 [打印本页]

作者: 蒙在股里    时间: 2015-1-16 10:37
标题: 今天来学习尺度的DIV布局纯CSS Lightbox黑屏遮挡窗口效果
其实DIV+CSS是很简单的一种布局方式,甚至比任何一种编程语言都要简单(虽然它不能算是编程语言)。
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDHTML4.01Transitional//EN"><html><head><title>纯CSSLightbox效果</title><style>.black_overlay{display:none;position:absolute;top:0%;left:0%;width:100%;height:100%;background-color:black;z-index:1001;-moz-opacity:0.8;opacity:.80;filter:alpha(opacity=80);}.white_content{display:none;position:absolute;top:25%;left:25%;width:50%;height:50%;padding:16px;border:16pxsolidorange;background-color:white;z-index:1002;overflow:auto;}</style></head><body><p>Thisisthemaincontent.Todisplayalightboxclick<ahref="javascript:void(0)"onclick="document.getElementById(light).style.display=block;document.getElementById(fade).style.display=block">here</a></p><divid="light"class="white_content">Thisisthelightboxcontent.<ahref="javascript:void(0)"onclick="document.getElementById(light).style.display=none;document.getElementById(fade).style.display=none">Close</a></div><divid="fade"class="black_overlay"></div></body></html>
尺度之路www.ckuyun.com提醒:能够先修正部分代码后再运转
大大增加协同工作的难度,很多没学过div的程序员对于美工出的div页面束手无措,稍微改错了,可能整个站点就惨不忍睹了。当然,如果你是一个全才,可以搞定一切,也可能不会。
作者: 再现理想    时间: 2015-1-18 07:09
还是在Dreamweaver所见即所得添加链接是,可以选中文字或图片然后按下shift键不放鼠标拖出箭头直接指向文件即可。这是比较简单的也是常用的方之一。
作者: 仓酷云    时间: 2015-1-22 07:14
HTML技术的不断发展和完善,随之而产生了众多网页编辑器,从网页编辑器基本性质可以分为所见即所得网页编辑器和非所见即所得网页编辑器(则原始代码编辑器)
作者: admin    时间: 2015-2-6 17:19
难以逾越的障碍会大大打击你的学习积极性。这就需要你的恒心,坚持不懈的决心。在自己无法解决某些问题时,就需要虚心请教别人.
作者: 莫相离    时间: 2015-3-5 22:13
使用内容管理系统进行开发并实现快速、精确的浏览器兼容性测试。
作者: 再见西城    时间: 2015-3-12 16:35
HTML技术的不断发展和完善,随之而产生了众多网页编辑器,从网页编辑器基本性质可以分为所见即所得网页编辑器和非所见即所得网页编辑器(则原始代码编辑器)
作者: 灵魂腐蚀    时间: 2015-3-20 00:06
可以使用 CSS 检查工具进行设计。




欢迎光临 仓酷云 (http://ckuyun.com/) Powered by Discuz! X3.2