1.基本语法规范
分析一个典型CSS的语句：
p {COLOR:#FF0000BACKGROUND:#FFFFFF}
其中"p"我们称为"选择器"(selectors)，指明我们要给"p"定义样式；
样式声明写在一对大括号"{}"中；
COLOR和BACKGROUND称为"属性"(property)，不同属性之间用分号""分隔；
"#FF0000"和"#FFFFFF"是属性的值(value)。
2.颜色值
颜色值可以用RGB值写，例如：color : rgb(255,0,0)，也可以用十六进制写，就象上面例子color:#FF0000。如果十六进制值是成对重复的可以简写，效果一样。例如:#FF0000可以写成#F00。但如果不重复就不可以简写，例如#FC1A1B必须写满六位。
3.定义字体
web标准推荐如下字体定义方法：
body { font-family : "Lucida Grande", Verdana, Lucida, Arial, Helvetica, 宋体,sans-serif}
字体按照所列出的顺序选用。如果用户的计算机含有Lucida Grande字体，文档将被指定为Lucida Grande。没有的话，就被指定为Verdana字体，如果也没有Verdana，就指定为Lucida字体，依此类推，；
Lucida Grande字体适合Mac OS X；
Verdana字体适合所有的Windows系统；
Lucida适合UNIX用户
"宋体"适合中文简体用户
如果所列出的字体都不能用，则默认的sans-serif字体能保证调用
4.群选择器
当几个元素样式属性一样时，可以共同调用一个声明，元素之间用逗号分隔，： p, td, li { font-size : 12px }
5.派生选择器
可以使用派生选择器给一个元素里的子元素定义样式，例如这样：
li strong { font-style : italicfont-weight : normal；}
就是给li下面的子元素strong定义一个斜体不加粗的样式。
6.id选择器
用CSS布局主要用层"div"来实现，而div的样式通过"id选择器"来定义。例如我们首先定义一个层
<div id="menubar"></div>
然后在样式表里这样定义：
#menubar {MARGIN: 0pxBACKGROUND: #FEFEFECOLOR: #666}
其中"menubar"是你自己定义的id名称。注意在前面加"#"号。
id选择器也同样支持派生，例如：
#menubar p { text-align : rightmargin-top : 10px}
这个方法主要用来定义层和那些比较复杂，有多个派生的元素。
6.类别选择器
在CSS里用一个点开头表示类别选择器定义，例如：
.14px {color : #f60 font-size:14px }
在页面中，用class="类别名"的方法调用：
<span class="14px">14px大小的字体</span>
这个方法比较简单灵活，可以随时根据页面需要新建和删除。
7.定义链接的样式
CSS中用四个伪类来定义链接的样式，分别是：a:link、a:visited、a:hover和a : active，例如：
a:link{font-weight : bold text-decoration : none color : #c00 }
a:visited {font-weight : bold text-decoration : none color : #c30 }
a:hover {font-weight : bold text-decoration : underline color : #f60 }
a:active {font-weight : bold text-decoration : none color : #F90 }
以上语句分别定义了"链接、已访问过的链接、鼠标停在上方时、点下鼠标时"的样式。注意，必须按以上顺序写，否则显示可能和你预想的不一样。记住它们的顺序是“LVHA”。
首先，本人在前端开发方面有点心得，有什么不对的地方希望给出建议让我更好的进步1.命名
在开发前必须有个命名规范来对代码统一规范团队代码结构，使代码可读性提高
2.注释
我相信每个人看别人代码时看到密密麻麻的代码结构，相信每个人都会很头疼，即使想看也会看不下去，而且很耗时间，所以注释就变得尤其得重要，注释越清楚越详细我相信代码可维护性越高，而且更容易修改维护
3.变量
在js中变量无处不在，所以这么声明变量就变得尤其得重要，首先少使用全局变量，这样会增加加载速度，从而导致项目用户体验不好
4.声明变量如果不用 var 会导致变量成为全局变量。
5.函数
函数的参数数量
函数的参数不应该超过 3 个。如果函数的参数超过 3 个，应该将一些参数进行封装。
6.函数参数传递
只传函数需要的参数。如
// 不推荐
function greet(data){
console.log('Hello, I am ' + data.name)
}
// 推荐
function greet(name){
console.log('Hello, I am ' + name)
}
7.函数的功能
一个函数只做一件事。这有助于测试和代码复用。
函数尽可能无副作用。无副作用指不修改传入的参数和全局变量。
8.减少重复代码
. 记得在某个文章中看到说，如果重复的代码出现 3 次，就应该重构重复的代码。
. 松耦合
. 一个函数只做一件事
. 缓存一些计算结果
9.避免全局变量
. 从分配置和离逻辑代码
. 不要修改不属于你的对象
. 不属于你的对象包括
. 浏览器原生对象，如 Object，Array等
DOM，如 document
BOM，如 window
类库对象
如果想拓展浏览器原生对象的功能，可以创建函数，函数中把浏览器原生对象传入。如Underscore.js 做 的那样。
10.代码风格的统一
11.尽可能的避免代码重复
.如何减少重复的代码呢？
.在JS中，可以将重复的代码写成一个方法，如果是可通用的，可以写在独立的JS文件中。
.在CSS中，则需要借助Sass，Less之类的预处理语言的Mixins的功能。将重复的部分写成一个Mixins。
12.配置和逻辑分开
. JS中，对于整个站的通用配置，写在config.js里。如果是某个js的配置，在文件的开头，用defaultParam 对象来存放可变的配置，用const来定义不可变的配置
. CSS中，依旧要借助预处理语言。对于整站的配置，定 义在_variables.scss里。对于某个具体CSS文件里，在文件开头用变量来定义
13.减少代码的副作用
1>JS中，方法中的沟通尽量不要用全局变量；不要在Array之类的全局对象的原型链上添加方法；尽量不要定义全局的方法和变量：如果确实有很多变量，方法放在全局上，可以学习jQuery,将很多变量，方法放在一个全局对象上；自定义事件，事件的名称也要有命名空间。
2>CSS中，要做到无副作用，难度很大。对于简单页面，一个方法是，把页面上的元素都分成一个个组件，写样式时，选择器要用组件选择器 当前元素选择器。当组件变的复杂时，组件也会包含很多子组件。然后，选择器就会越来越长。。。我的解决方案是用的BEM。
14.提高代码的可读性
.变量，方法等的合理命名，通过名称可以知道这个大概做什么的。
.如果则要加注释来说明一下。对于不容理解的代码加注释
.尽可能不用魔法数字
.对于HTML，选择合适标签
15.一个方法只做一件事
一来提高代码的复用性，二来让调试也变的更容易，三来让测试变的更容易
1、IE6支持max-height解决方法IE6支持最大高度解决CSS代码：
.yangshi{max-height:1000px_height:expression((document.documentElement.clientHeight||document.body.clientHeight)<1000?"1000px":"")overflow:hidden}
说明：max-height:1000px这个是IE6以上级其它品牌浏览器支持最大范围高度。而_height:expression((document.documentElement.clientHeight||document.body.clientHeight)<1000?"1000px":"")overflow:hidden则是让IE6支持max-height替代CSS代码，但效果和其它版本浏览器相同效果。
让所有浏览器都支持max-height的CSS样式代码，完整：
max-height:1000px_height:expression((document.documentElement.clientHeight||document.body.clientHeight)<1000?"1000px":"")overflow:hidden这里的1000和1000px是你需要的数值，注意3个数值的相同。
让IE6支持最大高度max-height的时候别忘记加上overflow:hidden
2、IE6支持min-height解决方法
IE6支持最小高度解决CSS代码：
.yangshi{min-height:1000px_height:expression((document.documentElement.clientHeight||document.body.clientHeight)>1000?"1000px":"")}
说明：min-height:1000px这个是IE6以上级其它品牌浏览器支持最小范围高度。而_height:expression((document.documentElement.clientHeight||document.body.clientHeight)>1000?"1000px":"")则是让IE6支持min-height替代CSS代码，但效果和其它版本浏览器相同效果。
让所有浏览器都支持min-height的CSS样式代码，完整：
min-height:1000px_height:expression((document.documentElement.clientHeight||document.body.clientHeight)>1000?"1000px":"")这里的1000和1000px是你需要的数值，注意3个数值的相同。
3、IE6支持max-height又支持min-height方法
让所有浏览器包括IE6即支持最大高度又支持最小高度。
.yangshi{Max-Height:620pxMin-Height:40px_height:expression(this.scrollHeight >620 ? "620px" : (this.scrollHeight <40 ? "40px" : "auto"))}
IE6支持Max-Height和支持Min-Height CSS代码
_height:expression(this.scrollHeight >620 ? "620px" : (this.scrollHeight <40 ? "40px" : "auto"))
说明：以上代码作用是让对象的最小高度为40px，最大高度为620px的CSS样式属性
