Menu
CoddyTech

Flexbox

Coddy CSS Flexbox:完整课程 课程的第 3 课,共 15 课。

我们来聊聊弹性容器。

要创建弹性容器,请将 display 属性设置为 flex,

.container {
  display: flex;
}

这可以与以下 HTML 部分配合使用,

<div class="container">
  <div>1</div>
  <div>2</div>
  <div>3</div>
  <div>4</div>
</div>
challenge icon

挑战

简单

创建一个弹性容器。

已提供对应的 HTML 代码,你的任务是添加缺少的 CSS 代码。

注意:不要更改给定的 HTML 代码或用于给元素着色的 CSS。

亲手试试

<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" href="styles.css">
</head>
    <body>
        <div class="container">
            <div>1</div>
            <div>2</div>
            <div>3</div>
            <div>4</div>
        </div>
    </body>
</html>

CSS Flexbox:完整课程中的所有课

自己练习: Web 在线编辑器