Home >Web Front-end >HTML Tutorial >Newbie asking for help: Why can't it be displayed in the center? _html/css_WEB-ITnose
Newbie asking for help: Why can't it be displayed in the center? _html/css_WEB-ITnose
- WBOYOriginal
- 2016-06-24 12:08:221097browse
The CSS code is as follows:
body{ margin:0; padding:0; text-align:center;}
div#heard{ background:url(images/hd.gif) no-repeat ; height:132px;}
div#pagebody{ background:url(images/content.gif) no-repeat; height:538px; padding:0 15px; }
div#footer{ background:url(images/ ft.gif) no-repeat; height:100px; padding-top:30px;}
HMTL is as follows:
93f0f5c25f18dab9d176bd4f6de5d30e
9d2b0b2467931ca2c4f1e9f48a290d7a
b2386ffb911b14667cb8f0f91ea547a7Example6e916e0f7d1e588d4f442bf645aedb2f
736c2758d1db46936e1881f46feda0fe
9c3bca370b5104690d9ef395f2c5f8d1
6c04bd5ca3fcae76e30b72ad730ca86d
d3566e992d46985536e02e637a79f3e316b28748ea4df4d9c2150843fecfba68
< ;div id="pagebody">16b28748ea4df4d9c2150843fecfba68
171c8477c82d74a9b2eea84eaab9316716b28748ea4df4d9c2150843fecfba68
36cc49f0c466276486e50c850b7e4956
It is left aligned after opening, which Something went wrong!
Reply to discussion (solution)
* {
margin: 0 auto;
}
<!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> body { text-align: center; } div#main { margin-right: auto; margin-left: auto; width: 400px; vertical-align: middle; line-height: 200px; } div#heard { background: url(images/1.jpg) no-repeat; height: 132px; } div#pagebody { background: url(images/1.jpg) no-repeat; height: 538px; } div#footer { background: url(images/1.jpg) no-repeat; height: 100px; } </style></head><body> <div id='main'> <div id="heard"> </div> <div id="pagebody"> </div> <div id="footer"> </div> </div></body></html>
body { text-align: center; }