前端编码规范小记

 

  现在的前端 编码比之前容易了好多

1  有flex布局,可以很方便的 布局出复杂的布局(之前div,css,float,伪类等 还是挺麻烦的) 

2 有es6语法糖  ,各种数据处理函数自带的,很方便。(之前都是纯js 写方法)

 

 

二   css属性顺序规范

建议相关的属性说明放在一组,并按照下面的顺序排列:

 1 css

定位(position、left、right、top、bottom、z-index)

盒子模型(display、float、width、height、margin、padding、border、border-radius)

排印(font、color、background、line-height、text-align)

由于定位可以从正常的文档流中移除元素,并且还能覆盖盒模型相关的样式,因此排在首位。而盒模型决定了组件的尺寸和位置,所以排第二位。排印只是影响元素的细节样式变化,所以放第三位。

 

 

三  html属性顺序规范

HTML 属性应该按照特定的顺序出现以保证易读性,而且一致的属性顺序可能提升 1.5% 的 gzip 压缩率

class

id, name

data-*

...

Classes 是为高可复用组件设计的,所以他们处在第一位。Ids 更加具体而且应该尽量少使用(例如, 页内书签),所以他们处在第二位。

 

 

 

 

转载于:https://www.cnblogs.com/softwarelanguagebs/p/9519369.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值