如何实现两栏布局

实现两栏布局，左侧宽度占三分之二，右侧宽度为三分之一并且保持固定不动不随页面滑动，该如何布局？

html css

阅读 6.1k

6 个回答

<body>
<div style="float:left;width:66%"></div>
<div style="float:right;width:34%;height=400px"></div> 
</body>

aeeee

845799142

发布于
2016-09-27

这个简单吧，左边一个div左浮动，里面嵌套两个div显示设置为行内元素，右边一个div

神奇的海螺

8137

发布于
2016-09-27

更新于
2016-09-27

1.一个父容器

2.子元素宽度为父容器的2/3与1/3，用百分比

3.设置子元素浮动

cloud_Guo

696

发布于
2016-09-28

<div style="width:800px;height:800px;">
  <div style="float:left;width:66%; background:#999;height:100%;"></div>
  <div style="float:right;width:34%; background:#ccc;height:100%;"></div>
</div>

jaye

20727

发布于
2016-09-28

左侧用浮动，右侧用position:fixed

<div style="float: left;width: 66%;"></div>
<div style="position:fixed;right: 0;top: 0;width: 34%;"></div>

fydor

1311411

发布于
2016-09-28

响应式布局

<div style="display:flex;">
    <div style="flex:2"></div>
    <div style="flex:1"></div>
</div>

撰写回答

你尚未登录，登录后可以

和开发者交流问题的细节
关注并接收问题和回答的更新提醒
参与内容的编辑和改进，让解决方法与时俱进

推荐问题

相似问题

找不到问题？创建新问题

如何实现两栏布局

你尚未登录，登录后可以

body :first-child(不是body:first-child，中间有空格)伪类选择器到底选中了什么元素？

如何实现类似豆包的AI改写框跟随内容滚动效果？

问一个鼠标滚动事件，这种是怎么实现的？

如何在CSS中实现滚动条不溢出圆角框？

form对象根据表单dom元素的name属性获取元素对象是基于什么标准的？兼容性如何？

请问，是否可以设定Table的宽度，或者不让其超过父容器呢？

如何在Ant Design表格中同时设置scroll.x和scroll.y且表头不换行？