
html 请用相对定位 绝对定位、浮动,对下面的页面分别实现多栏布局并且居中,分别写出CSS的样
html请用相对定位绝对定位、浮动,对下面的页面分别实现多栏布局并且居中,分别写出CSS的样式规则列表。<body><divid="container"><divid="...
html 请用相对定位 绝对定位、浮动,对下面的页面分别实现多栏布局并且居中,分别写出CSS的样式规则列表。
<body>
<div id="container">
<div id="header">header</div>
<div id="father">
<div id ="left">B</div>
<div id ="main">A</div>
<div id ="right">C</div>
</div>
<div id="footer">footer</div>
</div>
</body> 展开
<body>
<div id="container">
<div id="header">header</div>
<div id="father">
<div id ="left">B</div>
<div id ="main">A</div>
<div id ="right">C</div>
</div>
<div id="footer">footer</div>
</div>
</body> 展开
1个回答
展开全部
利用相对定位 绝对定位、浮动布局代码如下(直接复制以后代码即可):<!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=gb2312" /><title>相对定位 绝对定位、浮动布局</title><style>#container{ margin:0 auto; width:1000px; clear:both; position:relative;/*相对定位*/}#header{ margin:0 auto; width:1000px;height:100px; background:#f00; color:#fff;}#father{ margin:0 auto; width:1000px; height:500px;}#left{ margin:0 auto; width:200px; height:500px; float:left; background:#00CCFF;/*左浮动*/}#main{ margin:0 auto; width:600px;height:500px; background:#0066FF; float:left;/*左浮动*/}#right{ margin:0 auto; width:200px;height:500px; background:#00CCFF; float:right;/*右浮动*/}#footer{ margin:0 auto; width:1000px; height:100px; background:#f00; position:absolute;bottom:0; left:0;/*绝对定位*/}</style></head><body><div id="container"><div id="header">header</div><div id="father"> <div id ="left">B</div> <div id ="main">A</div> <div id ="right">C</div></div><div id="footer">footer</div></div></body></html>
本回答被提问者和网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?

2025-02-10 广告
可视化标签是广州晨控智能技术有限公司在物联网及自动识别领域的一项重要技术创新。通过先进的图形化界面设计,我们将复杂的数据信息转化为直观、易读的标签形式。这些标签不仅美观大方,更能够实时展示物品状态、库存数量、位置信息等关键数据。用户只需一眼...
点击进入详情页
本回答由晨控智能提供
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询