今天完成的事情：

1、完后昨天任务四中的一个疑点。

昨天任务四中的用css样式写出左边竖条的方法，今天查资料看了下，自己通过浏览器调试实践出来的方法1：

在div里用<span class=">的标签来写css样式。html代码如下：

然后在css中把<span>转换成inline-block行内块元素，设置width，height的px值，还有background的颜色，在浏览器中调试时显示出竖条出现在框内的顶部，没有居中对齐，这里我还是使用了vertical-align：middle垂直对齐中间的方法。代码如下：

通过设置宽高的值是可以让竖条的高和宽看上去美观合理，这里我用了margin-right外边距去设置input中的文字与边框之间的空隙。效果如下：

这样是写出来的效果。

但是发现这样写出来代码很多，有点繁琐，还有一种方法是可以直接用border-left设置。

方法2：写出来的代码简单，效果是一样的。

直接在input中加border-left：1 px solid #bababa；在设置内边距padding-left的值也是可以呈现出同样的效果。只不过这里用的是padding设置input框中文字与边框之间的空隙。css样式代码如下：

同样可以设置height的值来让input的边框来展现出你自己想要的效果。

这个有很多方法都可以实现出来，今天我只尝试了下这两种方法。

2、完成了任务四的二次提交。

3、学了photoshop的另一个切图的方法，选择ps中移动工具，切出来的图片经过width和height设置是这样的效果，比较美观。

明天的计划：

开始任务五的操作。

学习类名的命名方式。

问题：

查资料有时候自己上手操作代码的时候，没有效果，不知道是哪出了原因，感觉现在的自己还不能纠正错误。

收获：

做出一种效果有好几种方法，学会找到简单的方法去呈现出来。