Skip to content

Instantly share code, notes, and snippets.

@Fujihai
Created July 26, 2019 07:17
Show Gist options
  • Save Fujihai/cc648e9c9425c0179ea836b6abd16046 to your computer and use it in GitHub Desktop.
Save Fujihai/cc648e9c9425c0179ea836b6abd16046 to your computer and use it in GitHub Desktop.
flex 属性简写测试 // source https://jsbin.com/vomanal
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title> flex 属性简写测试</title>
<style id="jsbin-css">
.parent {
display: flex;
background: skyblue;
}
.son1 {
background: red;
}
.son2 {
background: green;
}
.son3 {
background: blue;
}
.son1, .son2, .son3 {
flex: 1 0 auto;
text-align: center;
}
</style>
</head>
<body>
<div class="parent">
<div class="son1">son1</div>
<div class="son2">son2</div>
<div class="son3">son3</div>
</div>
<script id="jsbin-source-css" type="text/css">.parent {
display: flex;
background: skyblue;
}
.son1 {
background: red;
}
.son2 {
background: green;
}
.son3 {
background: blue;
}
.son1, .son2, .son3 {
flex: 1 0 auto;
text-align: center;
}</script>
</body>
</html>
.parent {
display: flex;
background: skyblue;
}
.son1 {
background: red;
}
.son2 {
background: green;
}
.son3 {
background: blue;
}
.son1, .son2, .son3 {
flex: 1 0 auto;
text-align: center;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment