【品优购项目】总结2

1.li一行放不下的解决办法:
给大盒子添加一个overflow：hidden 完美解决问题或者
为大盒子增大宽度

2.文字和图标的对齐使用vertical-align对齐

3.transition 从一个状态渐变到另一个状态 “渐变”
transition : 要过渡的属性 花费时间 运动曲线 何时开始
花费时间 s 缓慢变化的时间
运动曲线 linear匀速 ease减速（默认） ease-in 加速
何时开始 可设置时间延迟
transition 这句写在原先 不是写在hover上
如果有多个属性，用逗号隔开
背景色也可以作为要过渡的属性
或者用all 表示要过渡的属性 所有属性都变

4. 获得焦点元素
   :focus 伪类选择器
   作用：点击图标前方的文字，光标定位至与其对应的文本框之中

5.省略号表示省略内容
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;

总结与反思
品优购项目是目前为止做的比较完整的一个页面，跟随老师的视频一同进行的，但仍然只是一个静态的网页。学到的许多的知识，还需要进一步的巩固加强，学过之后，脑海中有印象，等待老师提醒才唤醒记忆，警示着我及时的复习和预习，希望今后能够有所成长！加油！