<div class="pb"> <div class="pb-hd"> <a class="pb-x">✕</a><span>标题</span> </div> <div class="pb-bd"> <div class="pb-ct"> <div>好雨知时节， 当春乃发生。</div> </div> <div class="pb-ft"> <a class="pb-btn pb-cl">取消</a><a class="pb-btn pb-ok">确定</a> </div> </div> </div>
| 类名 | 描述 |
|---|---|
.pb{}
|
弹出层DIV外框架，可以定义边框、背景、字体等，配合CSS3可以设置圆角边框、阴影等 |
.pb .pb-hd {}
|
标题栏样式 |
.pb .pb-x {}
|
关闭按钮样式，
本例中没有使用任何图片
，如果你想改变关闭按钮风格，可以自定义。
|
.pb .pb-x:hover {}
|
关闭按钮样式鼠标经过样式。 |
.pb .pb-bd {}
|
内容区+按钮栏样式，基本保持不变即可。 |
.pb .pb-ct {}
|
内容区样式。 |
.pb .pb-ft {}
|
按钮栏样式。 |
.pb a.pb-btn {}
|
按钮样式。 |
.pb a.pb-ok {}
|
确定按钮样式。 |
.pb a.pb-ok:hover {}
|
确定按钮鼠标经过样式。 |
.pb a.pb-cl {}
|
取消按钮样式。 |
.pb a.pb-cl:hover {}
|
取消按钮鼠标经过样式。 |