【CSS】命名规范

头: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

来源: <http://www.douban.com/group/topic/2359257/>

来自为知笔记(Wiz)

时间: 2024-10-09 15:36:16

【CSS】命名规范的相关文章

css命名规范[来自网络]

1.css命名规范: 头:header 内容:content/container 尾:footer 导航:nav 侧栏:sidebar 栏目:column 页面外围控制整体布局宽度:wrapper 左右中:left right center 登录条:loginbar 标志:logo 抽奖:raffle广告:banner 页面主体:main 热点:hot 新闻:news 下载:download 子导航:subnav 菜单:menu 子菜单:submenu 搜索:search 友情链接:friend

css命名规范和书写规范

1.位置属性(position, top, right, z-index, display, float等)2.大小(width, height, padding, margin)3.文字系列(font, line-height, letter-spacing, color- text-align等)4.背景(background, border等)5.其他(animation, transition等) CSS书写规范 使用CSS缩写属性 CSS有些属性是可以缩写的,比如padding,mar

Html+CSS命名规范:

 Html+CSS命名规范: 1.样式命名: 2.样式文件命名: 数据库命名规范(Oracle表名长度不要超过30个字符,sql不限制): 1.数据库命名: 2.数据表命名:架构名+产品名+模块名.如:Report.Rept_ReportTemplateData 3.数据列命名:

CSS 命名规范及标题供参考与学习

一.CSS 命名规范 XHTML-CSS写作建议 所有的xhtml代码小写 属性的值一定要用双引号("")括起来,且一定要有值 每个标签都要有开始和结束,且要有正确的层次 空元素要有结束的tag或于开始的tag后加上"/" 表现与结构完全分离,代码中不涉及任何的表现元素,如style.font.bgColor.border等 <h1>到<h5>的定义,应遵循从大到小的原则,体现文档的结构,并有利于搜索引擎的查询. 给每一个表格和表单加上一个唯

#1 CSS命名规范

这个文章是之前学习的CSS的时候,为了规范CSS的命名,在网上找的一篇笔记. 觉得还不错,所以分享出来让大家看看. 原文传送门:http://www.divcss5.com/jiqiao/j4.shtml 网页制作中规范使用DIV+CSS命名规则,可以改善优化功效特别是团队合作时候可以提供合作制作效率,具体DIV CSS命名规则CSS命名大全内容篇. 常用DIV+CSS命名大全集合,即CSS命名规则 DIV CSS命名目录 命名规则说明 重要CSS命名 CSS命名参考表 命名技巧 我们开发CSS

CSS:命名规范心得分享

一个好的命名习惯(当然这里指的并不仅仅是CSS命名).不仅可以提高开发效率,而且有益于后期修改和维护. 假设我们当前使用的命名方式都是约定成俗的,所有人都是这样写,那么你去到一个新团队,或者别人来接手你的工作,都可以大大缩短去阅读别人代码的时间. 一个规范化的命名,不用说,只要想想就能体会到其中的好处了. CSS:命名规范心得分享 板块(Plate) 命名(Naming) 说明(Description)   主容器 wrapper 页面上最大的外部容器,如无特殊需求,不推荐使用 页面头部 hea

HTML5基础CSS命名规范讲解

相信有很多HTML5全栈开发的初学者对CSS的命名规则都是一头雾水,这可不是一个好的现象,那么下面就来给大家说一下HTML5全栈开发中的命名规范,希望可以帮到各位.. CSS命名规范 全局样式命名规范:global.css; 框架布局命名规范:layout.css; 字体样式命名规范:font.css; 链接样式命名规范:link.css; 打印样式命名规范:print.css; 常用类/ID命名规范 页眉规范:header 内容规范:content 容器规范:container 页脚规范:fo

简单好用的CSS命名规范

CSS命名规范 BEM命名法 BEM(Block, Element, Modifier)是由Yandex团队提出的一种前端命名规范.其核心思想是将页面拆分成一个个独立的富有语义的块(blocks),从而使得团队在开发复杂的项目变得高效,并且十分有利于代码复用,即便团队引入新成员,也容易维护. Block是块,比方说div.header,可以嵌套复用.更严格一点来说不能影响自身布局,最好不要设置margin和position,也不要使用元素选择器和ID选择器. Element是元素,比方说inpu

【html/css】html/css命名规范

无论做什么,规则总是最重要的.无规矩不成方圆,有了规矩,我们才能有规可循,有则可依,人与人之间才能正常的交流交往. 人人都有自己的命名习惯,不过,代码是需要交流的,当有些命名习惯仅只自己能看懂,甚至自己在过后都看不懂时,就成为了交流中的障碍了.所以,有一个规范的命名规则是很重要的.命名规则有很多,大家各取所需,这里介绍一下在html/css中一些约定俗成的命名规范,权作记录: 1.所有的命名最好都小写 2.属性的值一定要用双引号("")括起来,且一定要有值如class="di

CSS命名规范

html页面的CSS.DIV命名规则 CSS命名规则 头:header 内容:content/containe 尾:footer 导航:nav 侧栏:sidebar 栏目:column 页面外围控制整体布局宽度:wrapper 左右中:left right center 登录条:loginbar 标志:logo 广告:banner 页面主体:main 热点:hot 新闻:news 下载:download 子导航:subnav 菜单:menu 子菜单:submenu 搜索:search 友情链接: