<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>无标题文档</title> <style type="text/css"> body { margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; color: #ccc; background-color: #333; } #content{ padding:10px; margin:20px auto; background: #666; border: 5px solid #ccc; text-align:left; width:370px; } </style> </head> <body> <div id="content"> <pre> body { margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; font-family: verdana, arial, helvetica, sans-serif; color: #ccc; background-color: #333; text-align: center; /* part 1 of 2 centering hack */ } #content { 400px; padding: 10px; margin-top: 20px; margin-bottom: 20px; margin-right: auto; margin-left: auto; /* opera does not like 'margin:20px auto' */ background: #666; border: 5px solid #ccc; text-align:left; /* part 2 of 2 centering hack */ 400px; /* ie5win fudge begins */ voice-family: "\"}\""; voice-family:inherit; 370px; } html>body #content { 370px; /* ie5win fudge ends */ } </pre> <div align="right"><p><a href="css/01_centered_box.css">[full css]</a></p></div> </div> </body> </html>
显示如下:
http://www.thenoodleincident.com/tutorials/box_lesson/basic_centered.html
还可以这样:
设置
body{
margin:0 auto;
750px;
border:5px solid red;
}
一定要设置width。