CSS规范 - 分类方法 SS文件的分类和引用顺序 通常，一个项目我们只引用一个CSS，但是对于较大的项目，我们需要把CSS文件进行分类。 我们按照CSS的性质和用途，将CSS文件分成“公共型样式”、“特殊型样式”、“皮肤型样式”，并以此顺序引用（按需求决定是否添加版本号）。 公共型样式：包括了以下几个部分：“标签的重置和设置默认值”、“统一调用背景图和清除浮动或其他需统一处理的长样式”、“网站通用布局”、...
1、获取DOM对象后缓存到js变量中，避免重复查找DOM数 2、适配手机不同分辨率 最好用CSS3提供的media query（如果涉及到计算还是需要用到js）3、jQuery中css()方法可以接受多个样式不需要每个样式都写一遍 $('body').css({'width':'1px','height':'1px'}) 4、ajax提交都需要做失败处理 5、if..else中存在相同的代码，应该写在ifelse外 6、重复的代码封装成函数，方便复用 7、为了不污染全局作用域，建议将变量放在匿...
HTML规范 - 整体结构 HTML基础设施 文件应以“”首行顶格开始，推荐使用“”。 必须申明文档的编码charset，且与文件本身编码保持一致，推荐使用UTF-8编码。 根据页面内容和需求填写适当的keywords和description。 页面title是极为重要的不可缺少的一项。 12345678910111213141516 NEC：更好的CSS方案
/* reset */html,body,h1,h2,h3,h4,h5,h6,div,dl,dt,dd,ul,ol,li,p,blockquote,pre,hr,figure,table,caption,th,td,form,fieldset,legend,input,button,textarea,menu{margin:0;padding:0;}header,footer,section,article,aside,nav,hgroup,address,figure,figcaption,menu,details{display:block;}table{border-collapse:collapse;border-spacing:0;}caption,th{text-align:left;font-weight:normal;}html,body,fieldset,img,ifra...
/* function */.f-cb:after,.f-cbli li:after{display:block;clear:both;visibility:hidden;height:0;overflow:hidden;content:".";}.f-cb,.f-cbli li{zoom:1;}.f-ib{display:inline-block;*display:inline;*zoom:1;}.f-dn{display:none;}.f-db{display:block;}.f-fl{float:left;}.f-fr{float:right;}.f-pr{position:relative;}.f-prz{position:relative;zoom:1;}.f-oh{overflow:hidden;}.f-ff0{font-family:arial,\5b8b\4f53;}.f-...
/* animation *//* 淡入 */.a-fadein{-webkit-animation-name:fadein;-moz-animation-name:fadein;-ms-animation-name:fadein;animation-name:fadein;}/* define *//* 淡入 */@-webkit-keyframes fadein{ 0%{opacity:0;} 100%{opacity:1;}}@-moz-keyframes fadein{ 0%{opacity:0;} 100%{opacity:1;}}@-ms-keyframes fadein{ 0%{opacity:0;} 100%{opacity:1;}}@keyframes fadein{ 0%{opacity:0;} 100%{opacity:1;}}
黄金定律 永远遵循同一套编码规范,不管有多少人共同参与同一项目,一定要确保每一行代码都像是同一个人编写的. 语法: 1.用两个空格来代替制表符(tab);2.嵌套元素应当缩进一次(两个空格); 3.对于属性的定义,确保全部使用双引号,绝不要使用单引号; 4.不要在自闭合元素的尾部添加斜线--HTML5规范(https://dev.w3.org/html5/spec-author-view/syntax.html#syntax-start-tag)中明确说明这是可选的; 5.不要省略可选的结束...
这是一份旨在增强团队的开发协作，提高代码质量和打造开发基石的编码风格规范，其中包含了 HTML, JavaScript 和 CSS/SCSS 这几个部分。我们知道，当一个团队开始指定并实行编码规范的话，错误就会变得更加显而易见。如果一段特定的代码不符合规范的话，它有可能只是代码风格错误，而也有可能会是 bug。早期指定规范就使得代码审核得以更好的开展，并且可以更精确的地定位到错误。只要开发者们能够保证源代码源文件都严格遵循规范，...
CSS通用编码规范 总结一部分前端编码规范，CSS部分先奉上，大多比较通用，应该是主流方式吧。 1 前言 本文档的目标是使 CSS 代码在团队中风格保持一致，容易被理解和被维护。 尽管本文档是针对 CSS 设计的，但是在使用各种 CSS 的预编译器(如 less、sass、stylus 等)时，适用的部分也应尽量遵循本文档的约定。 2 CSS命名方式 保持 class 命名为全小写，可以使用短划线（不要使用下划线和 camelCa...
Atitit.css 规范 bem 项目中 CSS 的组织和管理 1. 什么是BEM？1 1.1. 块（Block）2 1.2. 元素（Element）2 1.3. BEM树（和DOM树类似）。3 1.4. 修饰符（modifier）的3 2. 块的独立性4 3. 独立的CSS4 3.1. 为独立的CSS类命名5 4. BEM争议最大的就是它的命名风格 6 5. OOCSS6 6. ACSS6 7. CSS 组织和管理 结论attilax总结7 8. Atibem7 8.1. Modifier 不用bem方式，太繁琐。使用...
声明必须是 HTML 文档的第一行，位于 标签之前。 声明不是 HTML 标签；它是指示 web 浏览器关于页面使用哪个 HTML 版本进行编写的指令。 用来声明 使用的html版本。 在 HTML 4.01 中， 声明引用 DTD，因为 HTML 4.01 基于 SGML。DTD 规定了标记语言的规则，这样浏览器才能正确地呈现内容。 HTML5 不基于 SGML，所以不需要引用 DTD。 提示：请始终向 HTML 文档添加 声明，这样浏览器才能获知文档类型。 在doctype中，...
结论： CSS是一种描述文档样式的语言，它不依赖于HTML，可以用于许多其他标记语言。它也不只是用于视觉媒介，还用于听觉媒介。 在CSS的世界里只有线框，用CSS思考就是用线框去思考，它给文档上所有可视或可读的东西都画了线框。这些线框的嵌套关系和文档结构上元素嵌套关系是不一样的，特定的排版方式都会改变它们的嵌套关系。首先确认线框的嵌套关系，再确认这个线框里所有线框的互相影响，记住关于尺寸，摆放位置，材质皮肤...
上个星期，制定的前端开发规范，今天抽查了css规范的执行；发现了很多问题 引入了css 模块化思想，可以接受少量的代码冗余，但不表示可以接受大面积的代码冗余。 表现症状1 .footer .home-icon:before{background-position:1px -166px;width: 42px;height: 40px;margin: 8px 0 2px}.footer .productList-icon:before{background-position:-45px -166px;width: 42px;height: 40px;margin: 8px 0 2px}.footer .me-icon:...
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,margin,font等等，这样精简代码同时又能提高用户的阅读体验。 去掉小数点前的”...
开发灵活，稳定，可持续 HTML 和 CSS 代码的规范。 HTML 语法 HTML5 doctype Language attribute 字符编码 Internet Explorer 兼容模式 引入 CSS 和 JavaScript 实用高于完美 属性顺序 Boolean 属性 减少标签数量 JavaScript 生成的标签 CSS CSS 语法 声明顺序 媒体查询位置 不要使用 @import 前缀属性 单条...