不符合NEC规范的选择器用法

.class{}

不要以一个没有类别的样式作为主选择器,这样的选择器只能作为后代选择器使用,比如.m-xxx .class{}。
        .m-xxx div{}

不要以没有语义的标签作为选择器,这会造成大面积污染,除非你可以断定现在或将来你的这个选择器不会污染其他同类。
        .g-xxx .class{}

不要在页面布局中使用后代选择器,因为这个后代选择器可能会污染里面的元素。
        .g-xxx .m-yyy{}.g-xxx .u-yyy{}

不要用布局去控制模块或元件,模块和元件应与布局分离独立。
        .m-xxx .f-xxx{}.m-xxx .s-xxx{}

不要通过模块或其他类来重定义或修改或添加已经定义好的功能类选择器和皮肤类选择器。
        .m-xxx .class .class .class .class{}

不要将选择器写的过于冗长,这会额外增加文件大小并且限制了太小范围的选择器,使树形结构过于严格应用范围过于局限,建议3-4个长度之内写完。

选择器并不需要完整反映结构嵌套顺序,相反,能简则简。
        .m-xxx .m-yyy .zzz{}

不要越级控制,如果.zzz是.m-yyy的后代选择器,那么不允许.m-yyy之外的选择器控制或修改.zzz。

此时可以使用.m-yyy的扩展来修改.zzz,比如.m-yyy-1 .zzz{}。

扩展类使用错误

扩展类必须和其基类同时使用于同一个节点。

错误:class="g-xxx g-yyy-1" class="m-xxx-1" class="u-xxx u-yyy-1" class="xxx-yyy"。
        正确:class="g-xxx g-xxx-1" class="m-xxx m-xxx-1" class="u-yyy u-yyy-1" class="xxx xxx-yyy"。

CSS规范 - 典型错误--(来自网易)的更多相关文章

  1. NEC css规范

    CSS规范 - 分类方法 SS文件的分类和引用顺序 通常,一个项目我们只引用一个CSS,但是对于较大的项目,我们需要把CSS文件进行分类. 我们按照CSS的性质和用途,将CSS文件分成“公共型样式”. ...

  2. CSS规范 - 优化方案--(来自网易)

    值缩写 缩写值可以减少CSS文件大小,并增加可读性和可维护性. 但并非所有的值都必须缩写,因为当一个属性的值缩写时,总是会将所有项都设置一遍,而有时候我们不希望设置值里的某些项. /* 比如我们用下面 ...

  3. CSS function--(来自网易)

    /* function */ .f-cb:after,.f-cbli li:after{;overflow:hidden;content:".";} .f-cb,.f-cbli l ...

  4. 常用样式制作思路 自定义按钮~自适应布局~常见bug seajs简记 初学者必知的HTML规范 不容忽略的——CSS规范

    常用样式制作思路   学习常用样式总结参考来自这里 带点文字链接列表利用:before实现 1 <!DOCTYPE html> 2 <html lang="en" ...

  5. Atitit.css 规范 bem  项目中 CSS 的组织和管理

    Atitit.css 规范 bem  项目中 CSS 的组织和管理 1. 什么是BEM?1 1.1. 块(Block)2 1.2. 元素(Element)2 1.3. BEM树(和DOM树类似).3 ...

  6. 前端开发规范:命名规范、html 规范、css 规范、js 规范

    上周小组的培训内容是代码可读性艺术,主要分享如何命名.如何优化代码排版,如何写好的注释.我们都知道写出优雅的代码是成为大牛的必经之路. 下面感谢一位前端开发小伙伴总结的前端开发规范,通过学习相关开发规 ...

  7. CSS规范 - 分类方法

    CSS文件的分类和引用顺序 通常,一个项目我们只引用一个CSS,但是对于较大的项目,我们需要把CSS文件进行分类. 我们按照CSS的性质和用途,将CSS文件分成“公共型样式”.“特殊型样式”.“皮肤型 ...

  8. 前端开发规范:命名规范、HTML 规范、CSS 规范、JavaScript 规范

    一个好的程序员肯定是要能书写可维护的代码,而不是一次性的代码,怎么能让团队当中其他人甚至一段时间时候你再看你某个时候写的代码也能看懂呢,这就需要规范你的代码了.我是有一点强迫症的人,上周我们后端给我了 ...

  9. #Google HTML&CSS规范指南

    Google HTML&CSS规范指南 翻译自原文 目录 Google HTML&CSS规范指南 1. 背景 2. 通用 2.1 通用样式规则 2.1.1 协议 2.2 通用格式规则 ...

随机推荐

  1. Ubuntu 开机自动启动

    # 开机启动 2018-12-13在etc目录下建立loraserver.sh文件,[**注意**:设置脚本的运行属性]其内容为 #!/bin/bash cd /home/zqkj/loraserve ...

  2. tomcat-内存溢出java.lang.OutOfMemoryErrory:PermGen space解决方法

    如果是PermGen space方法区内存溢出,可尝试加大MaxPermSize,如果是heap space 堆内存移除,可尝试修改Xmx 正常解决方法: 在注释下的第一行添加: JAVA_OPTS= ...

  3. Java收发邮件过程中具体的功能是怎么实现的

    SMTP协议 用户连上邮件服务器后,要想给它发送一封电子邮件,需要遵循一定的通迅规则,SMTP协议就是用于定义这种通讯规则的. 因而,通常我们也把处理用户smtp请求(邮件发送请求)的邮件服务器称之为 ...

  4. Docker swarm集群搭建教程

    一.什么是Swarm Swarm这个项目名称特别贴切.在Wiki的解释中,Swarm behavior是指动物的群集行为.比如我们常见的蜂群,鱼群,秋天往南飞的雁群都可以称作Swarm behavio ...

  5. java数据结构之hashMap

    初学JAVA的时候,就记得有句话两个对象的hashCode相同,不一定equal,但是两个对象equal,hashCode一定相同,当时一直不理解是什么意思,最近在极客时间上学习了课程<数据结构 ...

  6. hyperledger-fabirc1.2-ca-server的生产示例

    hyperledger-fabirc1.2-ca-server的生产示例,带TLS 在fabirc-samples/first-network中启动网络,其ca证书是利用crypto的工具生成的,但是 ...

  7. android开发之使用SQLite数据库存储

    http://blog.csdn.net/jason0539/article/details/16360835 SQLite 介绍 SQLite 一个非常流行的嵌入式数据库,它支持 SQL 语言,并且 ...

  8. 注册和卸载window service

    自己开发的windows service编译之后会生成的exe文件,不能直接运行,必须通过工具注册进系统的Service. 使用cmd运行命令执行注册和卸载: 注册service: C:\Window ...

  9. Linux命令(十四) 查看工作目录文件 ls

    目录 1.命令简介 2.常用参数介绍 3.实例 4.直达底部 命令简介 ls 命令是 Linux 下最常用的命令. ls 就是 list 的缩写.默认情况下 ls 命令用来打印出当前目录的清单, 如果 ...

  10. [转帖]Windows 使用netsh 命令行方式处理 windows防火墙的方法

    Windows防火墙命令行手册 https://blog.csdn.net/mystudyblog0507/article/details/79617629 简介 netsh advfirewall ...