css 一个容器内 一个宽度固定 一个宽度自适应
时间: 2024-03-19 10:43:45 浏览: 77
左侧固定宽度,右侧自适应宽度的CSS布局
可以使用 flex 布局实现。
首先,将容器设置为 display: flex,然后将其中一个子元素的宽度设置为固定值,例如 100px,另一个子元素的宽度设置为 flex: 1,表示自动适应剩余宽度。
HTML 代码示例如下:
```html
<div class="container">
<div class="fixed-width"></div>
<div class="auto-width"></div>
</div>
```
CSS 样式示例如下:
```css
.container {
display: flex;
}
.fixed-width {
width: 100px;
}
.auto-width {
flex: 1;
}
```
阅读全文