JS带有关闭按钮的弹窗

文本编辑器

DW

EditPlus

1.效果图

2.编写css 注意标签的书写及分号 必须是英文状态下的，代码可以直接粘贴复制body{ font-size:12px;}.tit{ font-size:14px; padding:0; margin:0; height:31px; line-height:31px; background: url(/jscss/demoimg/201309/titbg.gif) center top repeat-x #CBE4EF;}.tit b{ float:left; margin-left:15px;}.tit a{ float:right; margin-right:5px; margin-top:6px; display:inline;}a.cls{height:18px; width:18px;display:block; overflow:hidden; line-height:200px;}.nr{padding:10px; text-align:left;}a.cls,a.cls:link,a.cls:visited{background:url(/jscss/demoimg/201309/cls.gif) center 0 no-repeat;}a.cls:hover{background:url(/jscss/demoimg/201309/cls.gif) center -20px no-repeat;}.box{ border:1px #999999 solid; background:#FFF;}/*圆角边框*/.lt,.rt,.lb,.rb{ background-image:url(/jscss/demoimg/201309/abg.png);filter:alpha(opacity=10);-moz-opacity:.1;opacity:.1;line-height:0;}.lt,.rt,.lb,.rb{ height:6px;width:6px;}.t,.b,.l,.r{ background:#000000;filter:alpha(opacity=10);-moz-opacity:.1;opacity:.1;line-height:0;}.l,.r{width:6px;}.t,.b{height:6px;}.lt{ background-position:0 0;}.rt{ background-position:right 0;}.lb{ background-position:0 bottom;}.rb{ background-position:right bottom;}/*小三角*/s{position:absolute;top:-13px;*top:-13px;left:50px;display:block;height:0;width:0;font-size:0; line-height: 0;border-color:transparent transparent #666 transparent;border-style:dashed dashed solid dashed;border-width:10px;}i{position:absolute;top:-9px;*top:-9px;left:-10px;display:block;height:0;width:0;font-size: 0;border-width:10px;line-height: 0;border-color:transparent transparent #FFF transparent;border-style:dashed dashed solid dashed;}.open{ position:relative; width:150px; height:25px;line-height:180%; border:1px solid #FF9900; background:#FFCC00;margin:12% auto 0 400px; text-align:center;}.open span{cursor:pointer; display:block; width:100%;}.odiv{ position:absolute; top:29px; left:-1px; width:300px;}‍

4.编写html