围观 > 评审视频
推荐视频
推推 书籍搜索模块前端页面评审 12-10(第3期)
CSS书写顺序会影响页面加载时间?
2,442人观看 15 0

评审内容

本次视频讲解的是推推项目的搜索页,主要模块包括搜索栏,搜索历史,热门搜索、书目列表和书籍反馈,其中讲解了一些我们在写页面时经常会忽略掉的细节和代码规范等。

优点

1.页面元素完整,样式还原度高

2.页面结构一目了然,备注简单清晰

3.class命名没有随意使用拼音或者看不懂的字符

缺点

1.热门搜索部分定高之后导致元素超出的样式错误,这个部分不应该定高

2.CSS书写顺序不规范

3.使用img标签时没有加上alt属性

4.书籍反馈弹窗没有实现

建议

在用到img标签的时候需要把alt属性加上,当图片仅做装饰使用时alt的值可以为空。我们在写页面的时候要注意遵守CSS书写规范,书写顺序是有一套规范的,正确的样式顺序不仅易于查看易于浏览器渲染,并且也属于css样式优化的一种方式 以下为CSS书写顺序规范:

1.位置属性(position, top, right, z-index, display, float等)

2.大小(width, height, padding, margin)

3.文字系列(font, line-height, letter-spacing, color- text-align等)

4.背景(background, border等)

5.其他(animation, transition等)

评论
大V点评
最新评论
评论
V

waterfall

特约顾问
前美团前端工程师

记得刚开始学习前端的时候,每次写css样式都是用到什么就在样式表后添加什么,完全没有考虑到样式属性的书写顺序对网页加载代码的影响。后来逐渐才知道正确的样式顺序不仅易于查看,并且也属于css样式优化的一种方式

发表于 2019-01-26 18:15
0
V

格林

项目导师
校招VIP高级前端经理

实现弹窗的方法有很多,基本上就是通过JS来改变弹窗的CSS样式,jQuery中也有类似的方法,比如hide(),show(),fadeIn(),fadeOut()等

发表于 2019-01-26 18:15
0

帖子还没人回复快来抢沙发