How do I style the alert box with CSS?
Try jQuery UI
located here: http://jqueryui.com/demos/dialog/
They have a theme roller where you can style the dialog and modal boxes.
-- EDIT --
Answering your second question.
Check out the jsFiddle here: http://jsfiddle.net/8cypx/12/
<link rel="stylesheet" href="http://code.jquery.com/ui/1.8.21/themes/base/jquery-ui.css" type="text/css" media="all" />
<div onclick="check_domain_input()">Click</div>
<div id="dialog" title="Attention!" style="display:none">
Please enter a domain name to search for.
</div>
<script>
function check_domain_input()
{
$( "#dialog" ).dialog(); // Shows the new alert box.
var domain_val = document.getElementsByName('domain');
if (domain_val[0].value.length > 0)
{
return true;
}
$( "#dialog" ).dialog();
return false;
}
</script>
Instead of built-in Javascript dialog box popups - that are ugly and impossible to customize with CSS - I would recommend using jQuery dialog box controls. Those can be styled easily, and jQuery ships with many built-in themes for it, too.
http://docs.jquery.com/UI/Dialog
If i got you question correctly, i don't think you can do that, since the pop-ups are wired into the system of the client. However, designing what you described isn't that hard, viewing a DIV element or something.