编程狮在线代码实例

Tab
<>
""
''
()
{}
[]
/
:
;
?
,
.
$

输入

运行

xxxxxxxxxx
 
<!DOCTYPE html>
<html>
<meta charset="utf-8">
<title>编程狮(w3cschool.cn)</title>
<style>
    html,body{
     width: 100%;
     height: 200px;
    }
    .parent {
     display:flex;
     align-items: center;/*垂直居中*/
     justify-content: center;/*水平居中*/
     width:100%;
     height:100%;
     background-color:red;
    }
    .children {
     background-color:green;
    }
</style>
<body>
    <div class="parent">
      <div class="children">我是通过flex的水平垂直居中噢！</div>
    </div>
</body>

实例代码

运行结果