HTML5 做个页面！但是图片和导航都不居中！用了很多方法还是不行！求解决！

[苏梓宸爱编程]

怎么做到图二的效果！这是我写的代码求解决！已经纠结了我了一天多了！

[当作看不见]

你用一个大的div 包含所有的内容,设置外边距,auto,就不会出现这种了,你的图一看就是直接写的,没有想好设计的问题,

[当作看不见]

举个栗子

<style type="text/css">
#main{width:auto;margin: 0 15%;background-color: #28A4C9;height:500px}
#title{width:100%;background-color:green;height:200px}
</style>
<div id="main">
	<div id="title">hah</div>
</div>

[苏梓宸爱编程]

引用 2 楼 qq_29594393 的回复:

举个栗子

<style type="text/css">
#main{width:auto;margin: 0 15%;background-color: #28A4C9;height:500px}
#title{width:100%;background-color:green;height:200px}
</style>
<div id="main">
	<div id="title">hah</div>
</div>

不行我试过了！昨天

[当作看不见]

引用 3 楼 qq_31571895 的回复:

[quote=引用 2 楼 qq_29594393 的回复:] 举个栗子

<style type="text/css">
#main{width:auto;margin: 0 15%;background-color: #28A4C9;height:500px}
#title{width:100%;background-color:green;height:200px}
</style>
<div id="main">
	<div id="title">hah</div>
</div>

不行我试过了！昨天 [/quote] 找个高手来拯救你吧

[Little_Princekin]

.pic { margin-left:350px; float:left;}

[业余草]

百度云盘搜索

[FeeLinear_iiiiiiiiii]

牛B 代码都写到body外面了 margin 0 auto前提是块元素 你不给图片设置display:block 怎么可能起效

[小小猫咪可笑可笑]

重新加个div大类，包含导航栏，让你要的东西float在导航栏left

[小小猫咪可笑可笑]

还有就是，代码应该在body内的，老大

[低调是种无声的高调]

你这是复制了别人页面的东西来吗？自动生成的绝不可能是这个样子，不要以为有些东西放外面，调试不会影响body的排版

[俊刚、]

将header的样式设置为{width:80%;height:50px;margin:0 auto;} pic的样式{width:80%;margin:0 auto;}

[码农果冻]

整体的布局感觉很乱。你先用一个div设置他的样式为{ width:xxx;margin:auto;}就行了，还有一点，整体的框架代码都放在body里内

[qq_16563265]

你这个结构好乱啊，结构都是放在body里面的。 现在这样有两种方法买一个就是，图片变成背景，tt那个div的背景，ul用margin-left空出边距。另外一个就是图片放进tt里面左浮动，ul也左浮动，tt清除浮动。

[oysd0628]

引用 4 楼 qq_29594393 的回复:

[quote=引用 3 楼 qq_31571895 的回复:] [quote=引用 2 楼 qq_29594393 的回复:] 举个栗子

<style type="text/css">
#main{width:auto;margin: 0 15%;background-color: #28A4C9;height:500px}
#title{width:100%;background-color:green;height:200px}
</style>
<div id="main">
	<div id="title">hah</div>
</div>

不行我试过了！昨天 [/quote] 找个高手来拯救你吧[/quote] 拿什么来拯救他，div写在body外面，愿上帝来拯救他吧，阿门~

[qq_37705117]

内容只写在body里就可以，你的问题是所有的div没有规划好，需要一个总的div。然后margin，padding值设定在总div里就可以了。