简单好用的CSS命名规范和JS代码风格

CSS命名规范

BEM命名法

BEM(Block, Element, Modifier)是由Yandex团队提出的一种前端命名规范。其核心思想是将页面拆分成一个个独立的富有语义的块(blocks),从而使得团队在开发复杂的项目变得高效,并且十分有利于代码复用,即便团队引入新成员,也容易维护。

Block是块,比方说divheader,可以嵌套复用。更严格一点来说不能影响自身布局,最好不要设置marginposition,也不要使用元素选择器和ID选择器。

Element是元素,比方说inputp。是Block的组成部分。

Modifier是修饰,定义BlockElement的外观、状态、或者行为。当然这个部分并不是必须的,可以省略。

BlockElement之间通过__来连接,ElementModifier之间通过--来连接

总体就是Block__Element–Modifier

何时用Element何时用Block

如果一段代码可能被重用,并且它不依赖于页面中的其他组件,这时就可以使用Block,反之就可以使用Element

JavaScript代码风格

推荐去看Aribnb的文档,这里是Aribnb中文文档地址。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值