html规范总结

时间:2022-10-03 18:47:05

这个链接有规范的html 描述:http://nec.netease.com/standard

相关链接:

1. http://www.zhangxinxu.com/wordpress/2010/09/%E7%B2%BE%E7%AE%80%E9%AB%98%E6%95%88%E7%9A%84css%E5%91%BD%E5%90%8D%E5%87%86%E5%88%99%E6%96%B9%E6%B3%95/

css宗旨:精简高效的CSS命名的关键字有“分离”,“统一前缀”,方法为“面向属性的命名”,准则为“无层级、无标签”。其中,“分离”是“面向属性命名”的基础。“面向属性命名”和“无层级、无标签”属于两个不同的系列,一个针对短命名属性,一个针对长命名属性。但是,两个又互相依存

以下是各地摘抄节选

1.

关注点分离

将结构(markup)、表现样式(style)和行为动作(script)分开处理,尽量使三者之间的关联度降到最小,这样有利于维护

  • 必须将css文件引入并置于head中
  • 必须将js文件引入并置于body底部 ###大小写:只使用小写 所有的代码都应是小写的,包括元素名称、属性,属性值(除非text或CDATA的内容)、选择器、css属性、属性值(字符串除外)

2.

缩进

每次缩进使用4个空格不要使用Tab

.example {
color: blue;
}
<ul>
<li>Fantastic</li>
<li>Great</li>
</ul> 3.

注释

  • 单行注释,需在<!--后空一格,在-->前空一格
  • 多行注释,注释起始和结尾都另起一行,注释内容缩进4个空格,不要使用Tab
<!-- This is a one line comment -->
<p>This is a comment</p>
<!--
This comment is require more than one line, so we should use block-style indented text
--> 4.

图片和颜色

  • 给图片添加widthheight,提升页面加载速度
  • 给所有img添加alt属性(页面加载出错提示)
  • 不要使用或尽量少用gif文件

5

.展现内容分离

无论你是否使用框架,99%的展现设计应该在stylesheets中,以下几点应避免去做:

  • 不要使用内联样式,如:<div style="border: 1px">
  • <p>来代替<br>来对内容换行
  • 不要使用<em><strong>,用css来控制
  • 不要使用<i><b>,HTML5不赞成使用

6.

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等)

作者:词晖
链接:http://www.zhihu.com/question/19586885/answer/48933504
来源:知乎

7.css中用破折号不用下划线: http://www.cnblogs.com/kaiye/archive/2011/06/13/3039046.html
 
8.

1.2 CSS 定义结构

  • 三层结构:

    • 基础框架(reset.css/ 栅格系统等)
    • 通用模块(网页主题/ 通用组件等)
    • 页面样式(布局/ 覆盖等)

    第一层一般是浏览器默认样式重置文件、栅格系统等基础样式;第二层一般是基于基础框架开发的通用模块样式或主题;第三层一般是针对网页布局、根据具体情况书写的或对通用模块进行覆盖的样式。

 

html规范总结的更多相关文章

  1. iOS代码规范(OC和Swift)

    下面说下iOS的代码规范问题,如果大家觉得还不错,可以直接用到项目中,有不同意见 可以在下面讨论下. 相信很多人工作中最烦的就是代码不规范,命名不规范,曾经见过一个VC里有3个按钮被命名为button ...

  2. node&period;js学习(三)简单的node程序&amp&semi;&amp&semi;模块简单使用&amp&semi;&amp&semi;commonJS规范&amp&semi;&amp&semi;深入理解模块原理

    一.一个简单的node程序 1.新建一个txt文件 2.修改后缀 修改之后会弹出这个,点击"是" 3.运行test.js 源文件 使用node.js运行之后的. 如果该路径下没有该 ...

  3. 百度MIP页规范详解 —— canonical标签

    百度MIP的规范要求必须添加强制性标签canonical,不然MIP校验工具会报错: 强制性标签<link rel="/^(canonical)$/"> 缺失或错误 这 ...

  4. JavaScript var关键字、变量的状态、异常处理、命名规范等介绍

    本篇主要介绍var关键字.变量的undefined和null状态.异常处理.命名规范. 目录 1. var 关键字:介绍var关键字的使用. 2. 变量的状态:介绍变量的未定义.已定义未赋值.已定义已 ...

  5. JavaScript 开发规范

    本篇主要介绍JS的命名规范.注释规范以及框架开发的一些问题. 目录 1. 命名规范:介绍变量.函数.常量.构造函数.类的成员等等的命名规范 2. 注释规范:介绍单行注释.多行注释以及函数注释 3. 框 ...

  6. c&num;语言规范

    0x00 分类 C#语言规范主要有两个来源,即我们熟知的ECMA规范和微软的规范.尽管C#的ECMA规范已经前后修订4次,但其内容仅仅到C# 2.0为止.所以慕容为了方便自己和各位方便查询,在此将常见 ...

  7. OSGi规范的C&num;实现开源

    这是大约在3-4年前完成的一个C#实现的OSGi框架,实现的过程参照了OSGi规范与与一些实现思路(感谢当时的那些资料与项目),此框架虽然仅在几个小型项目有过实际的应用,但OSGi的规范实现还是相对比 ...

  8. 【腾讯优测干货分享】如何降低App的待机内存(二)——规范测试流程及常见问题

    本文来自于腾讯优测公众号(wxutest),未经作者同意,请勿转载,原文地址:https://mp.weixin.qq.com/s/806TiugiSJvFI7fH6eVA5w 作者:腾讯TMQ专项测 ...

  9. 超炫的HTML5粒子效果进度条 VS 如何规范而优雅地code

    最近瞎逛的时候发现了一个超炫的粒子进度效果,有多炫呢?请擦亮眼镜!   // _this.ch){ _this.particles.splice(i, 1); } }; this.Particle.p ...

  10. 我的公司培训讲义(1):&period;NET开发规范教程

    这是1年多以前我在公司所做讲座的讲义,现在与园友们分享,欢迎拿去使用.一起讨论.文中有若干思考题,对园友们是小菜一碟.另有设计模式讲义一篇,随后发布.博文上了首页,感谢博客园团队推荐,也感谢所有园友的 ...

随机推荐

  1. 《你不知道的JavaScript》整理(四)——原型

    一.[[Prototype]] JavaScript中的对象有一个特殊的[[Prototype]]内置属性,其实就是对于其他对象的引用. var myObject = { a: 2 }; myObje ...

  2. 2016 Google中国开发者大会游记

    本文地址:http://www.cnblogs.com/likeli/p/6146117.html 写在前面 平时一直埋头写代码,这次既然Google给了门票,也就来看看,看看这种世界顶尖的科技公司, ...

  3. ORA-10635&colon; Invalid segment or tablespace type

    上周星期天在迁移数据时,碰到了ORA-10635: Invalid segment or tablespace type 错误,当时的操作环境如下: 操作系统版本: [oracle@xxxxx scr ...

  4. 用 Xcode 开发 Cydia Substrate 插件(二)

    上次介绍了一个如何用 Xcode 来构建 Substrate 插件,但是开发的具体过程还没有涉及,而这往往又正是初学者最难下手的地方,所以有了本文的后续. 不过在开始之前你要先做好思想准备,相比较开发 ...

  5. 详解Objective-C的meta-class 分类: ios相关 ios技术 2015-03-07 15&colon;41 51人阅读 评论&lpar;0&rpar; 收藏

    比较简单的一篇英文,重点是讲解meta-class.翻译下,加深理解. 原文标题:What is a meta-class in Objective-C? 原文地址:http://www.cocoaw ...

  6. crontab的相关设置&amp&semi;linux定时备份数据库

    对于才了解crontab的人来说,应该按照以下的步骤来设置crontab 1.首先要检查是否装了crontab http://blog.sina.com.cn/s/blog_4881040d01011 ...

  7. Django中的信号及其用法

    Django中提供了"信号调度",用于在框架执行操作时解耦. 一些动作发生的时候,系统会根据信号定义的函数执行相应的操作 Django中内置的signal Model_signal ...

  8. composer 常用操作

    1.search   查询 例如:composer search redis 2.show   展示 例如: composer show -all  predis/predis 3.require   ...

  9. GIS开发之计算四参数,七参数

    一.四参数 想要通过控制点计算四参数,首先需要知道四参数的相关原理,推荐这篇文章: http://www.docin.com/p-1197326043.html 根据上面的计算公式,使用最小二乘法计算 ...

  10. &lbrack;BZOJ5302&rsqb;&lbrack;HAOI2018&rsqb;奇怪的背包&lpar;DP&rpar;

    由裴蜀定理得,一个集合S能得到w当且仅当gcd(S+{P})|w. 于是f[i][j]表示前i个物品gcd为j的方案数,发现gcd一定是P的因数,故总复杂度$O(n\sqrt{P}\log P)$(需 ...