console
<body>
<header>
<section id="part"">
<label for="title">ToDoList</label>
<input type="text" id="title" name="title" required="required" autocomplete="off"
placeholder="添加ToDo">
</input>
<!--
type="text" 类型规定文字
required="required" 必须要输入字段
placeholder 字体虚化，用value是实体
-->
</section>
</header>
<section>
<h2 onclick="save">正在进行
<span id="todocount">0</span>
</h2>
<h2>已经完成
<span id="donecount">0</span>
</h2>
</section>
<footer>
</footer>
</body>
body {
background: #cdcdcd;
margin: 0px;
padding: 0px;
font-size: 16px;
}
header{
background: #333;
height: 50px;
width: 100%;
}
#part{
margin:0 auto;
display: flex;
justify-content: space-around;
/* space-around 对齐内容：周围空间 */
}
header label{
font-size: 24px;
color: #ddd;
float: left;
width: 100px;
line-height: 50px;
cursor: pointer;
/* 指标，手指 */
}
header input{
float: right;
margin-top: 12px;
width: 60%;
height: 24px;
text-indent:10px;
border: none;
border-radius:5px;
box-shadow: 0 1px 0 rgba(255,255,255,0.24), 0 1px 6px rgba(0,0,0,0.45) inset;
}
section{
width: 600px;
}
h2{
float: left;
}
span{
float: right;
}