如果是，我告诉你，alert 的框是不能改变样式的，因为那个是 window 对象（大概）。
如果想要用自定义样式的警告框，那么，很多插件，可以帮到你，例如 artDialog，不过部分插件都已经有自己的样式。
还需要好好学习，多练习，内部样式中没有必要再使用绝对定位了，帮你调整了一下。.admonitorily{
width:392px
height:auto
padding:0
border:#99bbe8 1px solid
position:absolute
top:0
left:0
background:#f2f0f1
}
.top{
width:392px
height:25px
background:url(images/bg_1.png) repeat-x center
margin:0 auto
padding:0
}
.bottom{
width:390px
height:auto
border:#fff 1px solid
text-align:center
}
.bt {
width: 100%
overflow: auto
padding: 10px
}
.title{
color:#15428b
font-size:14px
font-family:Arial, Helvetica, sans-serif
font-weight:bold
}
.pic{
float:left
border:#ccc 1px solid
}
.word{
float:left
width:320px
height:auto
text-align:left
text-align:justify
border:#000000 1px solid
font-size:12px
font-family:Arial, Helvetica, sans-serif,宋体
}
.clear{
clear:both
}
.button{
width:370px
text-align:center
margin:50px 10px 10px
}
<div class="admonitorily">
<div class="top">
<span class="title">Error</span>
</div>
<div class="bottom">
<div class="bt">
<div class="pic"><img src="images/x.png" /></div>
<div class="word">The HTMLEditor IFrame The HTMLEditor IFrame The HTMLEditor IFrame The HTMLEditor IFrame The HTMLEditor IFrame The HTMLEditor IFrame The HTMLEditor IFrame </div>
</div>
<div class="button"><img src="images/button_1.jpg" onmousedown="this.src='images/button_2.jpg'" onmouseout="this.src='images/button_1.jpg'" /></div>
</div>
</div>
点击用JS实现：<script>
function disp_alert()
{
alert("我是警告框！！")
}
</script>
<a href="#" onclick="disp_alert()">点击</a>
按下 a:active{color:#f00}
经过：a:hover{color:#000}
不过一般都有顺序的 link,visited,hover,active一般是这样的顺序
