一、命名规则

)、尽量不缩写,除非一看就明白的单词

二、class的命名

(1).red { color: red; }

.f60 {color: #f60; }

.ff8600{ color: #ff8600; }

(2)字体大小,直接使用”font+字体大小”作为名称,如

.font12px{ font-size: 12px; }

.font9pt{font-size: 9pt; }

Ps:px就是表示pixel,像素,是屏幕上显示数据的最基本的点;

pt就是point,是印刷行业常用单位,等于1/72英寸;

pixel是相对大小,而point是绝对大小,也有说em是相对单位,而px和pt都是绝 对单位

px是以屏幕象素为单位。pt是以1/72英寸为单位

计算公式如下:那么1px = 1pt * 图像分辨率/72 
       PX和em转换的公式:
       对于PX转em的方法也类似,就是em=16乘以1px,也就是说1.5em=1.5×16=24px

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

.left { float:left; }

.bottom { float:bottom; }

(4) 使用”类别+功能”的方式命名(这个就不具体说了,看个人习惯和项目的具体情况而定)

(5)采用驼峰式命名,如下所示:

mainContent  newsContent   headerImage

使用驼峰式命名的好处:增强代码的可读性,避免引入额外的分隔符,从而减少字符数量

(6)不建议使用中线或者下划线,会增加文件的大小。(尽量不使用,个人习惯不好的可以慢慢改)

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

  1. CSS命名规范(规则)

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

  2. css命名规范和书写规范

    1.位置属性(position, top, right, z-index, display, float等)2.大小(width, height, padding, margin)3.文字系列(fon ...

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

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

  4. html,css命名规范 (转)

    HTML+CSS命名规范总结 1.HTML部分 1.1添加必须的utf-8的字符集,并且使用HTML5的简洁 方式: <meta charset="utf-8"> 1. ...

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

    一.CSS 命名规范   XHTML-CSS写作建议 所有的xhtml代码小写 属性的值一定要用双引号("")括起来,且一定要有值 每个标签都要有开始和结束,且要有正确的层次 空元 ...

  6. 通用CSS命名规范

    一.文件命名规范 样式文件命名主要的 master.css布局,版面 layout.css专栏 columns.css文字 font.css打印样式 print.css主题 themes.css [/ ...

  7. CSS 命名规范总结

    CSS 命名规范总结 BEM 命名给 CSS 以及 html 提供清晰结构,命名空间提供更多信息,模块化提高代码的重用,以达到 CSS 命名语义化.可重用性高.后期维护容易.加载渲染快的要求. 首先, ...

  8. CSS命名规范

    DIV+CSS规范命名大全集合 前端人员必看CSS命名规范 整理: 文件名必须由小写字母.数字.中划线组成 ).所有的命名最好都小写,一律采用小写加中划线的方式,不允许使用大写字母或 _2).属性的值 ...

  9. web前端开发CSS命名规范参考

    做为一个web前端工程师,每天接触HTML.css就像吃饭一样,但是作为一名合作.优秀的web前端工程师,对DIV+CSS命名还是有一定的规范的,本文整理了一份web前端开发中DIV+CSS各种命名规 ...

随机推荐

  1. ReentrantLock源码了解

    1).ReentrantLock.tryLock //获取没有被其他线程持有的锁 //1).当没有被任何线程持有时,首先将计数器设置为1,并设置当前持有锁的线程为当前线程,最后返回true //2). ...

  2. BZOJ 3101: N皇后 构造

    3101: N皇后 题目连接: http://www.lydsy.com/JudgeOnline/problem.php?id=3101 Description n*n的棋盘,在上面摆下n个皇后,使其 ...

  3. QNJR-GROUP/EasyTransaction: 依赖于Spring的一个柔性事务实现,包含 TCC事务,补偿事务,基于消息的最终一致性事务,基于消息的最大努力交付事务交付QNJR-GROUP/EasyTransaction: 依赖于Spring的一个柔性事务实现,包含 TCC事务,补偿事务,基于消息的最终一致性事务,基于消息的最大努力交付事务交付

    QNJR-GROUP/EasyTransaction: 依赖于Spring的一个柔性事务实现,包含 TCC事务,补偿事务,基于消息的最终一致性事务,基于消息的最大努力交付事务交付 大规模SOA系统的分 ...

  4. webdings 和 wingdings 字体

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  5. Linux/CentOS服务器 一个网卡绑定多IP地址(永久设置)

    有时我们在使用 Linux 服务器时需要配置多个IP地址.如果要配置多个IP地址是否需要多块网卡呢?答案是否定的.以 CentOS 系统为例,多个 IP 地址是可以共享一块物理网卡的. 如何永久为单网 ...

  6. 《Go学习笔记 . 雨痕》方法

    一.定义 方法 是与对象实例绑定的特殊函数. 方法 是面向对象编程的基本概念,用于维护和展示对象的自身状态.对象是内敛的,每个实例都有各自不同的独立特征,以 属性 和 方法 来暴露对外通信接口.普通函 ...

  7. 基于SmartThreadPool线程池技术实现多任务批量处理

    一.多线程技术应用场景介绍 本期同样带给大家分享的是阿笨在实际工作中遇到的真实业务场景,请跟随阿笨的视角去如何采用基于开源组件SmartThreadPool线程池技术实现多任务批量处理.在工作中您是否 ...

  8. nil coalescing operator

    nil coalescing operator ?? 就是 optional和 三元运算符?:的简写形式. 比如一个optional String类型的变量 var a:String? // prin ...

  9. 报错:无法截断表 '某表',因为该表正由 FOREIGN KEY 约束引用

    某表的某个字段作为另一个表的FOREIGN KEY,在truncate另外一个表后,再truncate某表,就报如上的错. 解决方法: → 删除另外一个表的外键 IF OBJECT_ID(N'[dbo ...

  10. 解决警告 warning: directory not found for option

    解决方法: 选择项目名称----->Targets----->Build Settings----->Search Paths----->Library Search Path ...