\u4e00\uff0c\u7528CSS\u4f7fDIV\u5c42\u6c34\u5e73\u5c45\u4e2d<\/p>\n
\u5bf9\u9700\u8981\u6c34\u5e73\u5c45\u4e2d\u7684DIV\u5c42\u6dfb\u52a0\u4ee5\u4e0b\u5c5e\u6027\uff1a<\/p>\n
margin-left: auto;
margin-right: auto;<\/p><\/blockquote>\n\u8fd9\u6837\u5728FF\u4e2d\u5df2\u7ecf\u5c45\u4e2d\u4e86,\u53ef\u662f\u5728IE\u4e2d\u770b\u8fd8\u662f\u6ca1\u6709\u5c45\u4e2d!<\/p>\n
\u95ee\u9898\u5e76\u4e0d\u5728CSS\u800c\u5728XHTML\u7f51\u9875\u672c\u8eab.
\u9700\u8981\u52a0\u4e0a\u8fd9\u6837\u7684\u4ee3\u7801\u624d\u80fd\u4f7f\u5f97\u4e0a\u8ff0\u8bbe\u7f6e\u6709\u6548\u679c:<\/p>\n<!DOCTYPE html PUBLIC "-\/\/W3C\/\/DTD XHTML 1.0 Transitional\/\/EN" "http:\/\/www.w3.org\/TR\/xhtml1\/DTD\/xhtml1-transitional.dtd"><\/p><\/blockquote>\n
\u5982\u4f55\u4f7fDIV\u5c45\u4e2d<\/p>\n
\u4e3b\u8981\u7684\u6837\u5f0f\u5b9a\u4e49\u5982\u4e0b\uff1a<\/p>\n
body { TEXT-ALIGN: center; }
#center { MARGIN-RIGHT: auto; MARGIN-LEFT: auto; }<\/p><\/blockquote>\n\u8bf4\u660e\uff1a
\u9996\u5148\u5728\u7236\u7ea7\u5143\u7d20\u5b9a\u4e49TEXT-ALIGN: center;\u8fd9\u4e2a\u7684\u610f\u601d\u5c31\u662f\u5728\u7236\u7ea7\u5143\u7d20\u5185\u7684\u5185\u5bb9\u5c45\u4e2d\uff1b\u5bf9\u4e8eIE\u8fd9\u6837\u8bbe\u5b9a\u5c31\u5df2\u7ecf\u53ef\u4ee5\u4e86\u3002\u4f46\u5728mozilla\u4e2d\u4e0d\u80fd\u5c45\u4e2d\u3002\u89e3\u51b3\u529e\u6cd5\u5c31\u662f\u5728\u5b50\u5143\u7d20\u5b9a\u4e49\u65f6\u5019\u8bbe\u5b9a\u65f6\u518d\u52a0\u4e0a\u201cMARGIN-RIGHT: auto;MARGIN-LEFT: auto; \u201d
\u9700\u8981\u8bf4\u660e\u7684\u662f\uff0c\u5982\u679c\u4f60\u60f3\u7528\u8fd9\u4e2a\u65b9\u6cd5\u4f7f\u6574\u4e2a\u9875\u9762\u8981\u5c45\u4e2d\uff0c\u5efa\u8bae\u4e0d\u8981\u5957\u5728\u4e00\u4e2aDIV\u91cc\uff0c\u4f60\u53ef\u4ee5\u4f9d\u6b21\u62c6\u51fa\u591a\u4e2adiv\uff0c\u53ea
\u8981\u5728\u6bcf\u4e2a\u62c6\u51fa\u7684div\u91cc\u5b9a\u4e49MARGIN-RIGHT: auto;MARGIN-LEFT: auto; \u5c31\u53ef\u4ee5\u4e86\u3002
\u5982\u4f55\u4f7f\u56fe\u7247\u5728DIV \u4e2d\u5782\u76f4\u5c45\u4e2d<\/p>\n\u7528\u80cc\u666f\u7684\u65b9\u6cd5\u3002\u4e3e\u4f8b\uff1a<\/p>\n
body{ BACKGROUND: url(http:\/\/www.w3cn.org\/style\/001\/logo_w … )#FFFno-repeatcenter; }<\/p><\/blockquote>\n
\u5173\u952e\u5c31\u662f\u6700\u540e\u7684center,\u8fd9\u4e2a\u53c2\u6570\u5b9a\u4e49\u56fe\u7247\u7684\u4f4d\u7f6e\u3002\u8fd8\u53ef\u4ee5\u5199\u6210\u201ctop left\u201d(\u5de6\u4e0a\u89d2)\u6216\u8005"bottom right"\u7b49\uff0c\u4e5f\u53ef\u4ee5\u76f4\u63a5\u5199\u6570\u503c"50 30"<\/p>\n
\u5982\u4f55\u4f7f\u6587\u672c\u5728DIV\u4e2d\u5782\u76f4\u5c45\u4e2d<\/p>\n
\u5982\u679c\u662f\u6587\u5b57\uff0c\u4fbf\u4e0d\u80fd\u7528\u80cc\u666f\u65b9\u6cd5\uff0c\u53ef\u4ee5\u7528\u589e\u9ad8\u884c\u8ddd\u7684\u529e\u6cd5\u53d8\u901a\u5b9e\u73b0\u5782\u76f4\u5c45\u4e2d\uff0c\u5b8c\u6574\u4ee3\u7801\u5982\u4e0b\uff1a<\/p>\n
<html>
<head>
<style>
body{ TEXT-ALIGN: center; }
#center{ MARGIN-RIGHT: auto;
MARGIN-LEFT: auto;
height:200px;
background:#F00;
width:400px;
vertical-align:middle;
line-height:200px;
}
<\/style>
<\/head>
<body>
<div id="center"><p>test content<\/p><\/div>
<\/body>
<\/html><\/p><\/blockquote>\n\u8bf4\u660e\uff1a
vertical-align:middle;\u8868\u793a\u884c\u5185\u5782\u76f4\u5c45\u4e2d\uff0c\u6211\u4eec\u5c06\u884c\u8ddd\u589e\u52a0\u5230\u548c\u6574\u4e2aDIV\u4e00\u6837\u9ad8line-height:200px;\u7136\u540e\u63d2\u5165\u6587\u5b57\uff0c\u5c31\u5782\u76f4\u5c45\u4e2d\u4e86\u3002
CSS+DIV\u63a7\u5236\u9875\u9762\u4e2d\u5143\u7d20\u5782\u76f4\u5c45\u4e2d\u4ee3\u7801 \u5168\u5c40\u548c\u533a\u57df\u5782\u76f4\u5c45\u4e2d<\/p>\n<style type="text\/css" media=screen>
body
{
text-align: center;
}
#a
{
width: 200px;
height: 400px;
background: #000;
}
#b
{
margin-top: expression((a.clientHeight-50)\/2);
width: 50px;
height: 50px;
background: #FFF;
}
#c
{
position: absolute;
left: expression((body.clientWidth-50)\/2);
top: expression((body.clientHeight-50)\/2);
width: 50px;
height: 50px;
background: #F00;
}
<\/style>
<div id="a">
<div id="b"><\/div>
<\/div>
<div id="c"><\/div><\/p><\/blockquote>\n\u53e6\u4e00\u65b9\u6cd5\uff1a<\/p>\n
<div style="background:blue;position:absolute;left:expression((body.clientWidth-50)\/2);top:expression((body.clientHeight-50)\/2);width:50;height:50"><\/div><\/p><\/blockquote>\n
***************************************<\/p>\n
\u4e8c\uff0c\u7528JS\u4f7f\u5c42\u5c45\u4e2d<\/p>\n
\u628a\u5982\u4e0b\u4ee3\u7801\u52a0\u5165<body>\u533a\u57df\u4e2d<\/p>\n
<DIV id=L1 style="HEIGHT: 107px; LEFT: 341px; POSITION: absolute; TOP: 585px; WIDTH: 205px; Z-INDEX: 1">
<TABLE bgColor=#ffffff border=1 borderColorDark=#ffffff borderColorLight=#000000 cellPadding=0 cellSpacing=0 width="100%">
<TR>
<TD height=1 width=178>\u25a1::BEST4U\u8bba\u575b::<\/TD>
<TD align=middle onclick="L1.style.visibility='hidden'"
style="CURSOR: hand" width=21>\u0445<\/TD><\/TR>
<TR vAlign=top>
<TD colSpan=2
height=91>\u6b22\u8fce\u5149\u4e34\u672c\u7ad9!<BR><BR>\u672c\u7ad9\u57df\u540d:<BR>http:\/\/webform.cn
<\/TD><\/TR><\/TABLE><\/DIV>
<SCRIPT LANGUAGE="JavaScript">
function moveit() \/\/\u8fd9\u4e2a\u51fd\u6570\u7528\u4e8e\u628a\u5c42\u653e\u5230\u6d4f\u89c8\u5668\u4e2d\u95f4
{
L1.style.left=((document.body.offsetWidth-parseFloat (L1.style.width))\/2)+document.body.scrollLeft;
L1.style.top=((document.body.offsetHeight-parseFloat (L1.style.height))\/2)+document.body.scrollTop;
}
window.onload=moveit; \/\/\u7f51\u9762\u6253\u5f00\u65f6\u65f6\u6267\u884cmoveit()
window.onresize=moveit; \/\/\u5f53\u8c03\u6574\u6d4f\u89c8\u5668\u5927\u5c0f\u65f6\u6267\u884cmoveit()
window.onscroll=moveit; \/\/\u5f53\u62c9\u52a8\u6eda\u52a8\u6761\u65f6\u6267\u884cmoveit()
<\/SCRIPT><\/p><\/blockquote>\n","protected":false},"excerpt":{"rendered":"\u4e00\uff0c\u7528CSS\u4f7fDIV\u5c42\u6c34\u5e73\u5c45\u4e2d \u5bf9\u9700\u8981\u6c34\u5e73\u5c45\u4e2d\u7684DIV\u5c42\u6dfb\u52a0\u4ee5\u4e0b\u5c5e\u6027\uff1a marg … \u7ee7\u7eed\u9605\u8bfb