网易CSS框架NEC:http://nec.netease.com/

NEC框架的CSS规范: 

CSS规范 - 分类方法

CSS规范 - 命名规则

CSS规范 - 代码格式

CSS规范 - 优化方案

CSS规范 - 最佳实践

CSS规范 - 典型错误

NEC - 代码库

NEC - 案例


统一语义理解和命名

布局(.g-)
语义 命名 简写
文档 doc doc
头部 head hd
主体 body bd
尾部 foot ft
主栏 main mn
主栏子容器 mainc mnc ( c 表示 child )
侧栏 side sd
侧栏子容器 sidec sdc
盒容器 wrap/box wrap/box
模块(.m-)、元件(.u-)
语义 命名 简写
导航 nav nav
子导航 subnav snav
面包屑 crumb crm
菜单 menu menu
选项卡 tab tab
标题区 head/title hd/tt
内容区 body/content bd/ct
列表 list lst
表格 table tb
表单 form fm
热点 hot hot
排行 top top
登录 login log
标志 logo logo
广告 advertise ad
搜索 search sch
幻灯 slide sld
提示 tips tips
帮助 help help
新闻 news news
下载 download dld
注册 regist reg
投票 vote vote
版权 copyright cprt
结果 result rst
标题 title tt
按钮 button btn
输入 input ipt
功能(.f-)
语义 命名 简写
浮动清除 clearboth cb
向左浮动 floatleft fl
向右浮动 floatright fr
内联块级 inlineblock ib
文本居中 textaligncenter tac
文本居右 textalignright tar
文本居左 textalignleft tal
垂直居中 verticalalignmiddle vam
溢出隐藏 overflowhidden oh
完全消失 displaynone dn
字体大小 fontsize fs
字体粗细 fontweight fw
皮肤(.s-)
语义 命名 简写
字体颜色 fontcolor fc
背景 background bg
背景颜色 backgroundcolor bgc
背景图片 backgroundimage bgi
背景定位 backgroundposition bgp
边框颜色 bordercolor bdc
状态(.z-)
语义 命名 简写
选中 selected sel
当前 current crt
显示 show show
隐藏 hide hide
打开 open open
关闭 close close
出错 error err
不可用 disabled dis

/*
#hd                Header
    #nv            Navigation
    #mu            Customer menu
.wp                Wrap
#ct                Container
    .mn            Main area
    .sd            Side area
#ft                Footer
----------------
.bm                Block in main area
.bn                Block in nerrow area
.bw                Block in full width

#pp                Personal Panel
.pm                Personal Message (Window)
.pmfl            PM friend list (Window)
*/


推荐大家使用的CSS书写规范、顺序

关于团队合作的css命名规范

(推荐)页面部件库整理

page -> grid(网格/布局) -> module(模块) -> widget(组件) -> unit(元件) -> figure(图形,比如说某个按钮)

CSS书写规范、命名规范、网易CSS框架NEC的更多相关文章

  1. CSS书写及命名规范

    1.样式书写顺序 positioning定位::position.display.float.top. right.bottom.left.overflow.clear.z-index: box mo ...

  2. html中css、div命名规范

    html中css.div命名规范 1.类class的命名规范示例 头:header 内容:content/container 尾:footer 导航:nav 侧栏:sidebar 栏目:column ...

  3. 再探CSS 中 class 命名规范

    一直以来我的CSS 的 class命名都是比较随意,有时采用驼峰式.有时采用下划线,好像没有什么统一的标准,想到什么英文单词就拿过来用,这对于自己瞎写的小项目无伤大雅,遇到冲突的问题可稍加调整改变即可 ...

  4. CSS+DIV标签命名规范 搜索引擎最喜欢

    搜索引擎优化(seo)有很多工作要做,其中对代码的优化是一个很关键的步骤.为了更加符合SEO的规范,下面是目前流行的CSS+DIV的命名规则: 登录条:loginBar  标志:logo  侧栏:si ...

  5. css样式文件命名规范

    样式文件命名规范 主要 master.css, style.css, main.css 布局 layout.css 专栏 columns.css 文字 font.css 打印 print.css 主题 ...

  6. css的一些命名规范

    网页制作中规范使用DIV+CSS命名规则,可以改善优化功效特别是团队合作时候可以提供合作制作效率,具体DIV CSS命名规则CSS命名大全内容篇. 常用DIV+CSS命名大全集合,即CSS命名规则 D ...

  7. java入门---基础语法&基础常识&编码规范&命名规范

        一个Java程序可以认为是一系列对象的集合,而这些对象通过调用彼此的方法来协同工作.下面简要介绍下类.对象.方法和实例变量的概念. 对象:对象是类的一个实例,有状态和行为.例如,一条狗是一个对 ...

  8. css基础(css书写 背景设置 标签分类 css特性)

      css书写位置   行内式写法 <p style="color:red;" font-size:12px;></p> 外联式写法 <link re ...

  9. 关于CSS书写规范、顺序

    关于CSS的书写规范和顺序,是大部分前端er都必须要攻克的一门关卡,如果没有按照良好的CSS书写规范来写CSS代码,会影响代码的阅读体验.这里总结了一个CSS书写规范.CSS书写顺序供大家参考,这些是 ...

  10. css书写顺序和常用命名推荐

    写代码的时候有一个好的规范和顺序能够帮你节省很多时间.下文将推荐相关CSS书写顺序和规范的一些方法.这个文档将会整理进前端规范文档中,如果你有更好的意见,不妨留言告知我们. CSS书写顺序 该代码来自 ...

随机推荐

  1. NIO与AIO,同步/异步,阻塞/非阻塞

    1.flip(),compact(),与clear()的使用 flip()内部实现,先将limit设为当前位置,再将缓冲区的postion设为0,所以是为将缓冲区的数据写出到其它通道或者get()作准 ...

  2. ZBrush该如何通过结合KeyShot制作逼真玉佩

    玉在中国的文明史上有着特殊的地位,古人的很多生活器具都是玉雕成的,能常戴在身上的惟有玉佩,古语有云"君子无故,玉不去身".即便到了现代,仍有很多人佩戴玉,倒不一定是因为它有多彰显地 ...

  3. 细说CSS选择器

    众所周知,CSS的一个核心特征就是能向文档中的一组元素类型应用某些规则.每个规则都有两个基本部分:选择器(selector)和声明块(declaration block).下图显示了规则的各个部分. ...

  4. 贪吃蛇(Java实现)

    程序效果: 代码: //Snake.java 1 package snake; import javax.swing.*; import java.awt.*; import java.awt.eve ...

  5. 基于ionic+cordova+angularJs从零开始搭建自己的移动端H5 APP

    这里详细介绍下如何用ionic+cordova+angularjs搭建自己的移动端app,包括环境搭建,框架使用等,具体项目已放置在github上,可下载下来自行启动. 下载地址:https://gi ...

  6. UVA 11404 Palindromic Subsequence[DP LCS 打印]

    UVA - 11404 Palindromic Subsequence 题意:一个字符串,删去0个或多个字符,输出字典序最小且最长的回文字符串 不要求路径区间DP都可以做 然而要字典序最小 倒过来求L ...

  7. BZOJ2748[HAOI2012]音量调节

    Description 一个吉他手准备参加一场演出.他不喜欢在演出时始终使用同一个音量,所以他决定每一首歌之前他都要改变一次音量.在演出开始之前,他已经做好了一个列表,里面写着在每首歌开始之前他想要改 ...

  8. Nmap参数详解

    转自:http://blog.csdn.net/huangwwu11/article/details/20230795 Nmap--networkmapper,网络探测工具和安全/端口扫描器 nmap ...

  9. testng 6.8.6 eclipse plugin

    http://files.cnblogs.com/mikelij/testng.zip

  10. js鼠标事件大全

    一般事件 事件 浏览器支持 描述 onClick HTML: 2 | 3 | 3.2 | 4 Browser: IE3 | N2 | O3 鼠标点击事件,多用在某个对象控制的范围内的鼠标点击 onDb ...