发表于： 2017-03-06 21:23:54
1 730
一、今天完成的事情
1.完成Task-4,Task-5做了一半。
二、明天要做的事情
1.完成Task-5、Task-6.
2.初步了解JS的DOM结构
三、遇到的问题
1.让一个元素居中，需要给父元素一个text-align： center;，这里犯了一个常识性的错误，经常直接给元素,作一下检讨。父级元素的text-align会被子级元素的浮动或定位效果给覆盖掉，从而失效，通过一个左浮一个右浮顺利完成任务的头部。
2.通过观察展示效果，发现input里的placeholder属性里的内容在鼠标点击时会消失，移开后又会恢复，这里用了一个小小的JS：
onfocus="this.placeholder=''" /*点击的时候文本设置为空*/
onblur="this.placeholder='请输入手机号'" /*离开的时候文本显示出来*/
3.消除input的边框以及点击时显示的边框分别用到了border: 0;和outline: none;
4.这里要注意一下在展示效果里，背景颜色不是白色，是灰色的。
5.手机跟锁图片的旁边都有一条竖线，用键盘上的"|"效果不理想，这里用一个span，给其设置宽高以及一个灰色背景顺利完成。
四、收获
进一步熟练了页面布局，完善了一些编码上的疏漏跟错误习惯，对于浮动的理解更深了一步。 以上
返回列表
评论