今天完成的事情：

1.回顾之前的代码，看一些规范是否合理，比如同类盒子是否写了多个css内容。

2.推进任务，目前完成情况：

明天计划的事情：

1.完善布局，原图像有两个三角符号，应该都用css画出，效果更好。

2.看任务深度思考。

遇到的问题：

1.bootstrap的应用，此任务此界面的按钮，我用了bootstrap的样式。如果引用的样式和自己需要的不同，需要更改，开始还不太理解如果同一个样式，多个不同的地方都要使用，该怎么办。后面师兄提出，标签的class命名可以应用多个，如

<div class="btn btn-1" type="button">

这样就可以定义第二个需要用到样式的地方了。以后的话应用的多了再写写。

2.尝试css画出三角形，图中已有一个三角符号，不过暂时不知道怎么调整它的左右间距。因为是通过旋转获得的，左右间距不在水平方向上。

收获：

1.文字对齐部分，text-align：center是水平方向居中，垂直方向居中可以用line-height，只要line-height等于容器高度就能实现文字居中。原理是行高=上间距+下间距+文本高度。故只要行高等于容器高度就可实现。

2.css画圆，先画一个正方形，宽度高度相等，再给出圆角，圆角数值等于宽高数值的一半，即可画出圆形。

3.实现当页面宽度缩小，文字被隐藏部分出现省略号的方法。

white-space: nowrap;/*不换行*/
text-overflow: ellipsis;/*文字隐藏时出现省略号*/
overflow-x: hidden;/*修剪内容*/

加入如上代码。文字不换行，并且宽度减少时会被修剪，然后使用text-overflow：ellipsis就可以实现出现省略号。