js弹窗小例子

2018-05-17 14:25:53 浏览数 (1)

布局大概是这样:

Paste_Image.png

首先,弄一个DIV,把弹窗的模子弄出来。 <divid="box"style="width:300px;height:180px;background:rgb(51,133,255);">

Paste_Image.png

嗯,主题就规定为蓝色吧。

第二步,添加标题栏。

因为继承;额父盒子的背景色,所以还看不出变化。接着,通过下面的代码将父盒子分成三块。

这样层次就出来了:

Paste_Image.png

给标题栏加上文字和关闭按钮。

Paste_Image.png

接下来,设置底部的按钮。(代码比较繁琐,还没有优化,就不贴代码了)

大概是这个样子:

0 人点赞