1,添加script manager 2,添加 ModalPopupExtender 3,转到代码页,设置以下属性:
<
cc1:ModalPopupExtender
ID
="ModalPopupExtender"
TargetControlID
="LinkButton3"
PopupControlID
="Panel1"
BackgroundCssClass
="modalBackground"
OkControlID
="OkButton"
CancelControlID
="CancelButton"
OnOkScript
="onclick();"
DropShadow
="true"
PopupDragHandleControlID
="Panel3"
runat
='server'
/>
targetcontrolID 是你点击的控件 PopupControlID 是弹出的窗口控件 BackgroundCssClass 是你的背景样式表 ... PopupDragHandleControlID 是你拖动Panel的区域控件
<
asp:Panel
ID
="Panel1"
runat
="server"
Style="display: none" CssClass="modalPopup"
>
<
asp:Panel
ID
="Panel3"
runat
="server"
Style
="cursor: move;background-color:#DDDDDD;border:solid 1px Gray;color:Black"
>
<
div
>
<
p
>
添加标签页
</
p
></
div
>
</
asp:Panel
>
<
div
><
br
/>
<
p
>
标签页名称:
<
asp:TextBox
ID
="TextBox1"
runat
="server"
></
asp:TextBox
></
p
><
br
/>
<
p
style
="text-align: center;"
>
<
asp:Button
ID
="OkButton"
runat
="server"
Text
="OK"
/>
<
asp:Button
ID
="CancelButton"
runat
="server"
Text
="Cancel"
/>
</
p
>
</
div
>
</
asp:Panel
>
css文件:
/*
Modal Popup
*/
.modalBackground
{
background-color
:
Gray
;
filter
:
alpha(opacity=70)
;
opacity
:
0.7
;
}
.modalPopup
{
background-color
:
#ffffdd
;
border-width
:
3px
;
border-style
:
solid
;
border-color
:
Gray
;
padding
:
3px
;
width
:
250px
;
}
.sampleStyleA
{
background-color
:
#FFF
;
}
.sampleStyleB
{
background-color
:
#FFF
;
font-family
:
monospace
;
font-size
:
10pt
;
font-weight
:
bold
;
}
.sampleStyleC
{
background-color
:
#ddffdd
;
font-family
:
sans-serif
;
font-size
:
10pt
;
font-style
:
italic
;
}
.sampleStyleD
{
background-color
:
Blue
;
color
:
White
;
font-family
:
Arial
;
font-size
:
10pt
;
}
css引用:
![](https://i-blog.csdnimg.cn/blog_migrate/f0cd6c7f9e7ae96feae062cb48f670f0.gif)