回想这整个周下来，做的事情不多也不少，但是觉得能够写出来这么多app的静态页面，心里也觉得是很开心了。
第一天，我做了登录之前的页面，因为之前从来没有接触过rem布局，所以一开始的时候，是有点无从下手的，于是就先去百度了一下rem相关的布局，了解到它是一种专门用来适应各种不同大小屏幕的方式，之前用的网页布局是px，所以从来没有写过rem，在写的过程中了解到rem都是针对于根元素也就是html进行控制的。所以需要在js中写一段脚本，告诉浏览器不同的屏幕宽度应该有不同的适应标准。并且在设置宽的时候尽量选择百分比，而不要选择rem，同时尽量不要设置大的div的margin，而应该使用padding，防止出现不可预期的错误。
聚焦输入框，默认值消失（其实是将值变成了透明色）：
input:focus::-webkit-input-placeholder {
color: transparent;
/* transparent是全透明黑色(black)的速记法，即一个类似rgba(0,0,0,0)这样的值 */
}
/* Mozilla Firefox 4 to 18 */
input:focus:-moz-placeholder {
color: transparent;
}
/* Mozilla Firefox 19+ */
input:focus::-moz-placeholder {
color: transparent;
}
图文排版：
左右：div中包裹两个标签，分别包含文字和图片，所以那就需要对其进行浮动，当图文不在同一个水平线的时候，需要对其中的图形进行vertical:middle操作。
上下：div中同样包裹两个标签，对其进行换行处理，并对div的行高进行设置，调整文字的位置。
水平方向的滚动：
首先对其父元素进行样式设置：
overflow-y: hidden;
overflow-x: auto;
white-space: nowrap;（超出不换行）
子元素需要左浮
做一个自己希望的下拉框样式：
首先写一个下拉框内容，将此下拉框的透明度设置为0，并将其z-index设置成为最大，让此元素在最上层，其次在下拉框上覆盖一个span标签，并根据需要利用border写一个自己需要的下拉箭头，当改变值得时候利用vue同时改变vue中的内容就可以达到下拉框的效果
最后，在切换选项卡的时候，我利用的：is来关联当前我点击的是哪个选项卡，i进而改变内容。
虽然东西不多，但这也是一个慢慢积累的过程，希望自己每一次做总结的时候都在更加优秀一点呀！
网友评论