CSS 网页布局实例：横向分栏水平居中的实现

发布时间：2018-09-29 16:05:20 所属栏目：创业来源：站长网

导读：CSS 网页机关实例：横向分栏程度居中的实现 CSS 横向分栏机关实例，在内容表现区，由于元素未界说高度，以是必需添加内容，才气更好地表现元素的位置。也就是给正文表现区更大的余地，让内容抉择正方的高度，由于本机关实例就是横向稳固竖向变，以满意差异

　　CSS 网页机关实例：横向分栏程度居中的实现

　　CSS 横向分栏机关实例，在内容表现区，由于元素未界说高度，以是必需添加内容，才气更好地表现元素的位置。也就是给正文表现区更大的余地，让内容抉择正方的高度，由于本机关实例就是横向稳固竖向变，以满意差异的机关必要。

　　猛火提醒：只是简朴的机关实例，样式并未美化，喜好的伴侣可以本身通过CSS美化，假如您还不认识CSS，请阅读由猛火提供的CSS中文手册。

　　以下是实例：

<!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>css横向分栏</title> <style> body { margin:0; } #main { margin:0 auto; width:760px; border:none; } #header { height:100px; margin:5px 0; } #nav { height:20px; margin:0 0 5px; } #content { margin:0 0 5px; } #footer { height:30px; } div { border:1px solid #000000; } </style> </head> <body> <div id="main"> <div id="header">header部门</div> <div id="nav">nav部门</div> <div id="content">这里是内容部门<br />由于元素未界说高度<br />以是必需添加内容<br />才气更好地表现元素的位置</div> <div id="footer">footer部门</div> </div> </body> </html>
提醒：可修改儿女码再运行!

（编辑：河北网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!

首富马斯克谈成功？他	从先行者到制定者，轻
中国互联网的新一轮机	马斯克想辞职做专业网