说法一:

属性的书写顺序, 举个例子:

.hotel-content {
/* 定位 */
display: block;
position: absolute;
left: 0;
top: 0;
/* 盒模型 */
width: 50px;
height: 50px;
margin: 10px;
border: 1px solid black;
/ *其他* /
color: #efefef;
} 定位相关, 常见的有:display position left top float 等
盒模型相关, 常见的有:width height margin padding border 等
其他属性
按照这样的顺序书写可见提升浏览器渲染dom的性能

说法二:

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命名规则

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

  标签:tags

  文章列表:list

  提示信息:msg

  小技巧:tips

  栏目标题:title

  加入:joinus

  指南:guide

  服务:service

  注册:regsiter

  状态:status

  投票:vote

  合作伙伴:partner

相关资料:

  • https://jingyan.baidu.com/article/4d58d541dae69a9dd4e9c09b.html
  • https://www.zhihu.com/question/19586885
  • https://www.cnblogs.com/liyunhua/p/4537058.html#top

【css】css规范的更多相关文章

  1. CSS命名规范

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

  2. CSS书写规范、命名规范、网易CSS框架NEC

    网易CSS框架NEC:http://nec.netease.com/ NEC框架的CSS规范:  CSS规范 - 分类方法 CSS规范 - 命名规则 CSS规范 - 代码格式 CSS规范 - 优化方案 ...

  3. html和css书写规范

    HTML 规范 分离的标记.样式和脚本 结构.表现.行为分离 在可能情况下验证你的标记 使用编辑器验证你的标记是否正确,一般编辑器都自带有这个功能. 技术不支持的时候使用备胎,如canvas 编码格式 ...

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

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

  5. CSS书写规范

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

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

    写了这么久的CSS,但大部分前端er都没有按照良好的CSS书写规范来写CSS代码,这样会影响代码的阅读体验,这里总结一个CSS书写规范.CSS书写顺序供大家参考,这些是参考了国外一些文章以及我的个人经 ...

  7. 分享给大家的CSS书写规范、顺序

    写了这么久的CSS,但大部分前端er都没有按照良好的CSS书写规范来写CSS代码,这样会影响代码的阅读体验,这里总结一个CSS书写规范.CSS书写顺序供大家参考,这些是参考了国外一些文章以及我的个人经 ...

  8. CSS书写规范及顺序

    CSS书写顺序 1.位置属性(position, top, right, z-index, display, float等)2.大小(width, height, padding, margin)3. ...

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

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

  10. CSS 编码规范

    转自: https://segmentfault.com/a/1190000005046830 CSS书写格式 1.格式化代码 1.1文件 [建议]:CSS文件使用无BOM的UTF-8编码 1.2缩进 ...

随机推荐

  1. 09-HTML-form标签

    <html> <head>  <title>form标签学习</title>  <meta charset="utf-8"/& ...

  2. 浅析 JavaScript 中的 Function.prototype.bind() 方法

    Function.prototype.bind()方法 bind() 方法的主要作用就是将函数绑定至某个对象,bind() 方法会创建一个函数,函数体内this对象的值会被绑定到传入bind() 函数 ...

  3. JS中的柯里化(currying)

    何为Curry化/柯里化? curry化来源与数学家 Haskell Curry的名字 (编程语言 Haskell也是以他的名字命名). 柯里化通常也称部分求值,其含义是给函数分步传递参数,每次传递参 ...

  4. HTML5效果:Canvas 实现圆形进度条并显示数字百分比

    实现效果 1.首先创建html代码 <canvas id="canvas" width="500" height="500" styl ...

  5. maven 术语

    1, 中央仓库 是一个网络仓库, 用于存储各种 jar 和 maven 插件, 官方网站显示的是列表, 不友好, 一般搜索依赖到一个三方地址: https://mvnrepository.com/ 2 ...

  6. Android tabLayout+recyclerView实现锚点定位

    原文链接:https://mp.weixin.qq.com/s/L3o2i3WTmg1ScXEYDS8YCg 在上一篇文章 Android 实现锚点定位中,我们介绍了tablayout+scrollV ...

  7. c++趣味之返回void

    void a(){} void b(){return a();} int main() { b(); ; } 这个是能编译的(vs,gcc),void函数是能返回,一般不会这么写,但是这样确实可以.你 ...

  8. HtmlAgilityPack 的东西

    之前都是用正则抓取页面,本人正则不咋地,有些东西用抓取来很费劲,呵呵 在网上看到别人推荐一个 HtmlAgilityPack 的东西,网上找了资料,自己写了个抓取网页的例子,框架用的ASP.NET M ...

  9. mac上Docker安装&初体验

    Docker是什么? Docker是一个虚拟环境容器,可以将你的开发环境.代码.配置文件等一并打包到这个容器中,并发布和应用到任意平台中. 官方文档:https://docs.docker.com H ...

  10. java笔记----java新建生成用户定义注释

    ${filecomment} ${package_declaration} /** * @author ${user} * @date 创建时间:${date} ${time} * @version ...