web标准实战css网页布局内容摘要：
th: 350px。 float: left。 /* 如果 float right，在 IE 下有问题，这里 fix 一下 */ marginleft: 60px。 /* 栏间距，即 gutter */ marginright: 410px。 /* 这一句很重要 */ } 查看至今为止的效果 如果我们在 HTML 里面先写固定宽度的 sidebar，那么 CSS 相当简单了，只需将 sidebar 浮动到右边，然后 main 再 marginright: 410px。 就可以了，很 solid。 这样 main 的宽度也自适应了。 CSS 如下（实际项目中我会采用这种写法，本例不是）： Example Source Code []sidebar{ float: right。 /* 注意在 HTML 里面 sidebar 写在 main 前面 */ width: 350px。 } main{ marginright: 410px。 } 三、左栏新评论列表 刚才说了，这里可以用 dl、 ul、 ol 或者 div，用什么是个人习惯或者根据需要。 我在这里用 ol，其他的写法都可以由此扩展。 HTML 结构代码如下： Example Source Code []ol li h3这里是评论的标题 /h3 ! Logo 和各部分的大标题已经使用了 h1 和 h2 p评论的作者头像 img和其他信息 /p p评论的摘要 /p /li ... /ol 这里的图片是用户的头像，所以我觉得应该和用户名放在一起。 那么这种写法，用绝对定位简便一些。 再提一下，如果使用浮动，必须给浮动的对象设置宽度，不然其宽度就会根据内容计算，这里的 h3 就不大方便用反向浮动的方法，因为它需要自适应宽度（如果用反向浮动的方法，可以参考上面布局的 CSS 写法）。 好了，基本问题解释清楚，我们开始写这里的样式（注意要清除 ol 的 margin）： Example Source Code [].ment{ lists。阅读剩余 0%
本站所有文章资讯、展示的图片素材等内容均为注册用户上传(部分报媒/平媒内容转载自网络合作媒体)，仅供学习参考。
用户通过本站上传、发布的任何内容的知识产权归属用户或原始著作权人所有。如有侵犯您的版权，请联系我们反馈本站将在三个工作日内改正。