CSS3 弹性盒子-CSS3 入门教程-PHP中文网教程

CSS3 弹性盒子

新建文件

                    <!DOCTYPE html>
<html>
<head>
 <meta charset="utf-8">
 <title>php中文网(php.cn)</title>
 <style>
 .flex-container {
 display: -webkit-flex;
 display: flex;
 width: 400px;
 height: 250px;
 background-color: lightgrey;
 }

 .flex-item {
 background-color: cornflowerblue;
 width: 100px;
 height: 100px;
 margin: 10px;
 }
 </style>
</head>
<body>

<div class="flex-container">
 <div class="flex-item">flex item 1</div>
 <div class="flex-item">flex item 2</div>
 <div class="flex-item">flex item 3</div>
</div>

</body>
</html>                

提交重置代码

自动运行

全屏

暂无课件

取消回复发送

取消发布笔记发送

CSS3 弹性盒子

全部评论我要评论

全部笔记发布笔记