头:header   
内容:content/container   
尾:footer   
导航:nav   
侧栏:sidebar 
栏目:column   
页面外围控制整体布局宽度:wrapper   
左右中:left right center   
登录条:loginbar   
标志:logo   
广告:banner   
页面主体:main   
热点:hot   
新闻:news 
下载:download   
子导航:subnav   
菜单:menu   
子菜单:submenu   
搜索:search   
友情链接:friendlink   
页脚:footer   
版权:copyright   
滚动:scroll   
内容:content 
标签页:tab 
文章列表:list 
提示信息:msg 
小技巧:tips 
栏目标题:title 
加入:joinus 
指南:guild 
服务:service 
注册:regsiter 
状态态:status 
投票:vote 
合作伙伴:partner

注释的写法

/* Footer */ 
内容区 
/* End Footer */

id的命名 
容器: container 
页头:header 
内容:content/container 
页面主体:main 
页尾:footer 
导航:nav 
侧栏:sidebar 
栏目:column 
页面外围控制整体布局宽度:wrapper 
左右中:left right center

id的命名

页面结构

容器: container 
页头:header 
内容:content/container 
页面主体:main 
页尾:footer 
导航:nav 
侧栏:sidebar 
栏目:column 
页面外围控制整体布局宽度:wrapper 
左右中:left right center

导航

导航:nav 
主导航:mainbav 
子导航:subnav 
顶导航:topnav 
边导航:sidebar 
左导航:leftsidebar 
右导航:rightsidebar 
菜单:menu 
子菜单:submenu 
标题: title 
摘要: summary

功能 
标志:logo 
广告:banner 
登陆:login 
登录条:loginbar 
注册:regsiter 
搜索:search 
功能区:shop 
标题:title 
加入:joinus 
状态:status 
按钮:btn 
滚动:scroll 
标签页:tab 
文章列表:list 
提示信息:msg 
当前的: current 
小技巧:tips 
图标: icon 
注释:note 
指南:guild 
服务:service 
热点:hot 
新闻:news 
下载:download 
投票:vote 
合作伙伴:partner 
友情链接:link 
版权:copyright

class的命名

(1)颜色:使用颜色的名称或者16进制代码,如 
.red { color: red; } 
.f60 { color: #f60; } 
.ff8600 { color: #ff8600; }

(2)字体大小,直接使用"font+字体大小"作为名称,如 
.font12px { font-size: 12px; } 
.font9pt {font-size: 9pt; }

(3)对齐样式,使用对齐目标的英文名称,如

.left { float:left; } 
.bottom { float:bottom; }

(4)标题栏样式,使用"类别+功能"的方式命名,如 
.barnews { } 
.barproduct { }

注意事项

1.一律小写; 
2.尽量用英文; 
3.不加中杠和下划线; 
4.尽量不缩写,除非一看就明白的单词. 
主要的 master.css 
模块 module.css 
基本共用 base.css 
布局,版面 layout.css 
主题 themes.css 
专栏 columns.css 
文字 font.css 
表单 forms.css 
补丁 mend.css 
打印 print.css

CSS命名规则的更多相关文章

  1. 常用的css命名规则:

    关于团队合作的css命名规范 常用的css命名规则: 头:header 内容:content/container 尾:footer 导航:nav 侧栏:sidebar 栏目:column 页面外围控制 ...

  2. 【转】常用css命名规则

    常用的css命名规则 头:header 内容:content/container 尾:footer 导航:nav 侧栏:sidebar 栏目:column 页面外围控制整体布局宽度:wrapper 左 ...

  3. CSS 命名规则

    CSS书写顺序: 位置属性(position, top, right, z-index,display, float等) 大小(width, height, padding, margin) 文字系列 ...

  4. 一些CSS命名规则

    一些CSS命名规则 头:header 内容:content/containe 尾:footer 导航:nav 侧栏:sidebar 栏目:column 页面外围控制整体布局宽度:wrapper 左右中 ...

  5. CSS命名规则常用的css命名规则

    CSS命名规则常用的css命名规则 头:header 内容:content/container 尾:footer 导航:nav 侧栏:sidebar 栏目:column 页面外围控制整体布局宽度:wr ...

  6. [转] 常用的CSS命名规则

    (一)常用的CSS命名规则  头:header  内容:content/container  尾:footer  导航:nav  侧栏:sidebar  栏目:column  页面外围控制整体布局宽度 ...

  7. CSS命名规范(规则)常用的CSS命名规则

    CSS命名规范(规则)常用的CSS命名规则   CSS命名规范(规则)常用的CSS命名规则   头:header   内容:content/container   尾:footer ...

  8. CSS命名规则和如何命名

    CSS命名规则 头:header 内容:content/containe 尾:footer 导航:nav 侧栏:sidebar 栏目:column 页面外围控制整体布局宽度:wrapper 左右中:l ...

  9. div+css命名规则

    作为一个前端菜鸟,进公司的第一个项目就是中途从外包公司接过来的公司网站,在别人写过了的基础上接着写,命名什么的,简直不要太痛苦. 目前,这个网站已经完成,但是被后台人员指出命名不规范.有心想解释一两句 ...

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

    页头:header  如:#header{属性:属性值;}或.header{属性:属性值;},也许你需要了解class与id区别及用法登录条:loginBar         标志:logo      ...

随机推荐

  1. 64位gcc编译32位汇编

    由于使用as和ld来编译链接汇编程序,在使用C库的时候比较麻烦,需要输入比较多的指令,所以使用gcc进行编译链接.由于书中内容是32位汇编程序,但是机器使用的是64位操作系统,自带的gcc也是64位的 ...

  2. android studio 中怎么使用adb无线调试

    之前再eclipse下进行安卓开发,但谷歌却抛弃了eclipse而力挺android studio开发环境,没办法只好跟着走. 在eclipse下开发时调试用adb无线方式特别方便,但是在androi ...

  3. 帝国cms 灵动标签

    [e:loop={栏目ID/专题ID,显示条数,操作类型,只显示有标题图片,附加SQL条件,显示排序}] <a href="<?=$bqsr[titleurl]?>&quo ...

  4. 学习opengl十大网站(转载)

    [转载] 1.http://nehe.gamedev.net/这个是我觉得全世界最知名的OpenGL教程,而且有网友将其中48个教程翻译成了中文http://www.owlei.com/Dancing ...

  5. CentOS安装Xen

    1.服务器环境及Xen版本: CentOS 5.4 64bit Xen-3.4.3,已经自带安装包 2.自制本地yum源: 安装httpd,指向本地xen yum源 3.修改yum.repo使其指向本 ...

  6. 解决spring-mvc @responseBody注解返回json 乱码问题

    在使用spring-mvc的mvc的时候既享受它带来的便捷,又头痛它的一些问题,比如经典的中文乱码问题.现在是用json作为客户端和服务端 的数据交换格式貌似很流行,但是在springmvc中有时候会 ...

  7. iOS中计算文件夹中文件大小

    通常用于删除缓存的时,计算缓存大小 //单个文件的大小 - (long long) fileSizeAtPath:(NSString*) filePath{ NSFileManager* manage ...

  8. CrossApp 0.3.1示例编译问题解决过程

    1 AlertTest.h找不到 问题成因:HelloCpp工程中头文件搜索路径没有增加Classes目录,需要自己加进去.(另外由于这些文件都是在子目录中,用递归模式也行,逐个子目录添加也行) 2 ...

  9. 所学新知——int、char型转string 类型等

    1. 利用stringstream类 定义头文件#include<sstream> 通过 int a; char b; sstream ss,ss1; ss<<a; ss1&l ...

  10. 学习笔记之 初试Linux遇到的问题 2015-10-13

    1. 安装.deb文件,用sudo gdebi XXX.deb sudo apt-get install xxx 2. 需要配置系统路径: LD_LIBRARY_PATH=.../lib:LD_LIB ...