前端html+ css布局

使用 HTMl 和 CSS 实现 3 列布局，左右固定宽度，移动端显示为单列垂直布局 ，不是本工程内的改动，给我一个代码段即可

<div class="layout">
    <aside class="layout-left">左侧</aside>
    <main class="layout-main">中间</main>
    <aside class="layout-right">右侧</aside>
</div>

.layout {

display: flex;

gap: 16px;

}

.layout-left,

.layout-right {

flex: 0 0 240px;

}

.layout-main {

flex: 1;

min-width: 0;

}

@media (max-width: 768px) {

.layout {

flex-direction: column;

}

.layout-left,

.layout-right {

flex: none;

width: 100%;

}

}