二列固定宽度居中布局

最新推荐文章于 2025-04-08 10:03:01 发布

codeshark

最新推荐文章于 2025-04-08 10:03:01 发布

阅读量867

点赞数

分类专栏： Div+CSS 文章标签： xhtml layout html

本文链接：https://blog.csdn.net/codeshark/article/details/2626830

版权

Div+CSS 专栏收录该内容

14 篇文章

订阅专栏

<!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">

#layout{margin:0px auto;width:408px;}/*layout居中了，里面容器的也就居中显示。*/

#left{background-color:#cccccc;border:2px solid #333333;width:200px;height:300px;float:left;}

#right{background-color:#cccccc;border:2px solid #333333;width:200px;height:300px;float:left;}

/*注意#layout的宽度值设定408px*/

</style>

</head>

<body>

<div id="layout">

<div id="left">左侧</div>

<div id="right">右侧</div>

</div>

</body>

</html>