Javascript消息框颜色 [英] Javascript Messagebox colour

问题描述

在我的asp.net代码中，我使用javascript来显示消息框

Hi,
In my asp.net code I used javascript for displaying a messagebox

<script type="text/JavaScript" >
  
      alert('Today you have consumed 20% of Average');
     
    </script>

该消息框是白色的.我想给消息框添加颜色.有什么方法可以做到这一点?

That Messagebox is white in colour.I want to give colour to the messagebox.Is there any way to do that?

推荐答案

有很多可自定义的弹出窗口或对话框可用. jQuery支持各种各样的此类ui插件，您可以在google上找到它.意思是虽然我会建议一些.使用这些插件，您可以轻松升级您的页面包含的外观.

Apprise-The-attractive-alert-alternative-for-jQuery

confirm_boxes_with_jquery ，在此站点中，您会发现多种创建自己的警报框的方法.只要检查它..它哇！ :-)

There are lots of customizable pop-up or dialog box is available. jQuery support wide range of these kind of ui plug-in you can find it on google. mean while i will suggest some of the. using these plug-in you can easily upgrade ur page contain of looks.

Apprise-The-attractive-alert-alternative-for-jQuery

confirm_boxes_with_jquery, in this site you will find multiple way to create your own alert box. Just check it .. its a Wow!! :-)

您不能，警报对话框使用系统的主题(或更准确地说，是浏览器的主题).如果要更改警报的外观，则必须创建自己的模式对话框.

You can''t, the alert dialog uses the system''s (or more accurately, the browser''s) theme. If you want to change the way alerts look you will have to create your own modal dialogs.

是的，可以通过覆盖浏览器的默认window.alert方法来实现. br/> 检查自定义警报演示 [

Yes you can do it by over-riding the default window.alert method of a browser.
Check Custom Alert Demonstration[^] for learning it in details.

The css used to color and change format is as below...

#modalContainer {
    background-color: transparent;
    background-image: url("tp.png");
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 10000;
}
#alertBox {
    background-color: #F2F5F6;
    background-image: url("alert.png");
    background-position: 20px 30px;
    background-repeat: no-repeat;
    border: 2px solid #000000;
    margin-top: 50px;
    min-height: 100px;
    position: relative;
    width: 300px;
}
#modalContainer > #alertBox {
    position: fixed;
}
#alertBox h1 {
    background-color: #78919B;
    border-bottom: 1px solid #000000;
    color: #FFFFFF;
    font: bold 0.9em verdana,arial;
    margin: 0;
    padding: 2px 0 2px 5px;
}
#alertBox p {
    font: 0.7em verdana,arial;
    height: 50px;
    margin-left: 55px;
    padding-left: 5px;
}
#alertBox #closeBtn {
    background-color: #78919B;
    border: 2px solid #000000;
    color: #FFFFFF;
    display: block;
    font: 0.7em verdana,arial;
    margin: 5px auto;
    padding: 3px;
    position: relative;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    width: 70px;
}
#mContainer {
    border-bottom: 2px solid #000000;
    border-top: 2px solid #000000;
    font: 0.7em verdana,arial;
    margin: auto;
    padding: 5px;
    position: relative;
    width: 600px;
}
h1, h2 {
    border-bottom: 1px solid #000000;
    font: bold 1.5em verdana;
    margin: 0;
    padding: 4px;
}
code {
    color: #006699;
    font-size: 1.2em;
}
#credits {
    border-bottom: 1px solid #000000;
    border-top: 1px solid #000000;
    font: 0.7em verdana;
    height: 90px;
    margin: 25px auto 0;
    padding-top: 4px;
    position: relative;
    width: 350px;
}
#credits img {
    border: 1px solid #000000;
    float: left;
    height: 79px;
    margin: 5px 10px 5px 0;
    width: 80px;
}
.important {
    background-color: #F5FCC8;
    padding: 2px;
}
code span {
    color: green;
}

在那里演示了重写浏览器默认window.alert方法的代码.

谢谢...

And the code for over-riding the default window.alert method of a browser is demonstrated there.

Thanks...

这篇关于Javascript消息框颜色的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！