1.为页面某区域内某标签有一些操作，可以先用div包括这些区域，然后通过ID或得，再进一步获得里面的标签。eg,var ff=document.getElementById('xx');
var dds=ff.getElementsByTagName('a');
jquery click自动完成循环。

$(document).ready(function(){

  $("a").click(function() {
        alert("Hello world!");
         });


});

 

 

2.CSS可控制超链接样式-css链接样式如下
a:link是超级链接的初始状态
a:hover是把鼠标放上去时悬停的状况 
a:active 是鼠标点击时 
a:visited是访问过后的情况

1)、通常对全站超链接样式化方法
a{color:#333;text-decoration:none; } //对全站有链接的文字颜色样式为color:#333;并立即无下划线text-decoration:none;
a:hover {color:#CC3300;text-decoration:underline;}//对鼠标放到超链接上文字颜色样式变为color:#CC3300;并文字链接加下划线text-decoration:underline;

2)、通过链接内设置类控制超链接样式css方法
案例超链接代码<a href="http://www.divcss5.com/" class="yangshi">CSS</a>
对应CSS代码
a.yangshi{color:#333;text-decoration:none; }
a.yangshi:hover {color:#CC3300;text-decoration:underline;}
通过这样的设置可以控制链接内的css类名为“yangshi”超链接的样式

3)、通过对应超链接外的父级的css类的css样式来控制超链接的样式
案例超链接代码<div class="yangshi"><a href="http://www.divcss5.com/">CSS</a></a>
对应CSS代码
.yangshi a{color:#333;text-decoration:none; }
.yangshi a:hover {color:#CC3300;text-decoration:underline;}

 

 

3.CSS中鼠标指针设置为手型有两种写法：cursor:hand和cursor:pointer.
cursor:pointer应该是符合W3C标准的。


4.1)flaot浮动造成IE6下面双倍边距问题:
margin-left:10px!important;/*IE7,IE8,FF下是10PX*/;margin-left:5px;/*IE6下属性写的是5PX，但在显示出来的是10px

2)在属性前面加符号如：*、&，￥，#，@，—，+，加过符号的属性只有IE的浏览器才识别，而FF不识别，方法如下(注意有符号的属性和没符号的属性的顺序)
height:100px;/*FF下显示100的高*/
+height:120px;/*IE678下显示120高*/

3)清除浮动
在设置过浮动的那个DIV下面加一个DIV，CSS面写个clear:both;如下
(1).<divstyledivstyle="float:left;height:100px;width:500px;">
(2).<divstyledivstyle="clear:both;"> 
(3).<divstyledivstyle="height:100px;width=300px"> 


4)页面居中两要素：(1）大盒子 (2）绝对宽度


5)通过兼容性实现IE6、7、8下三种不同效果：
如IE6下背景红色，IE7下蓝色FF下绿色
（注意顺序，可以好好理解一下）。
7L&t-o7k-a1I
red; /*FF里显示的红色*/
+blue!important; /*IE7下面显示的蓝色*/
+background:green;/*IE6下面显示的绿色*/

 

6)<metahttp-equivmetahttp-equiv="x-ua-compatible"content="IE=7"/> 把这段代码放到<head>里面，在IE8里面的页面解析起来就跟IE7一模一样的了，所以，基本上可以无视IE8，剩下的代码只需要这样写就可以了
1）.background:#ffc;/*对firefox有效*/  
2）.*background:#ccc;/*对IE7有效*/  
3._background:#000;/*只对IE6有效*/ 

firefox能解析第一段，后面的两个因为前面加了特殊符号“*”和“_”,firefox认不了，所以只认background:#ffc，看到的是×××；
IE7前两短都能认，以最后的为准，所以最后解析是background:#ccc，看到的是灰色；
IE6三段都能认，而且“_”这个只有IE6能认，所以最后解析是_background:#000，看到的是黑色

如果你发现按我这样写还是有问题的话，请查看一下你的html头，看看<head>之前的内容是不是这样的标准写法  
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN"    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <htmlxmlnshtmlxmlns="http://www.w3.org/1999/xhtml"> 
这个是现在比较规范的写法，非这种规范写法的，兼容性不能保证。

 

7)Css代码     
<style type=”text/css”>
 #body { border:2px solid #00f; /*ff的属性*/ 
 border:2px solid #090\9;   /* IE6/7/8的属性 */
 border:2px solid #F90\0;     /* IE8支持 */   
 _border:2px solid #f00;     /*IE6的属性*/ } 

</style> 
-----
 Html代码     

<div id=”body”>  
<ul>  <li>FF下蓝边</li>  
<li>IE6下红边</li> 
<li>IE7下绿边</li> 
<li>IE8下黄边</li>  
</ul>  
</div>  注:css顺序不能写错，因为ff不认识\9,\0,_写法,所以为蓝边;\9是IE6，7，8的属性,下面代码并没有重写IE7的代码，所以IE7下绿边;同理,\0为ie8属性，相当于重写了颜色，所以IE8下为黄边,_是ie6的属性,重写颜色为红边.


8)IE6里DIV错位的问题       采用”FLOAT：LEFT“的DIV在IE8、IE7、都没问题，IE6下却向下移动，出现空白。这是因为，IE6采用的内核默认把DIV之间的距离增加了3~5个PX，所以，试试是将下移的DIV的STYLE里增加"margin-left:-5px;"或者更小。 


4.css hack

1)下划线hack
IE 6 及以下的版本可以识别带有下划线前缀的属性，而其它的浏览器会忽略它。因此，一个属性前面加上下划线或者连字符，就成为了IE6及以下版本浏览器的专有属性。
(hack使用了无效的CSS，不推荐使用）


2)星号hack
(hack使用了无效的CSS，不推荐使用）
(适用于IE7以下版本)

　　除了下划线和连字符，版本7及以下的IE可以识别以非字母字符为前缀的属性，而其它浏览器会忽略。

 

3)星号 HTML hack
(适用于IE4-6)
* html p {font-size: 5em; }
这个HACK使用了完全有效的CSS。


4)星号加号HACK
(适用于IE7)
*:first-child+html p { font-size: 5em; }
或者：
*+html p { font-size: 5em; }

 

5)否定伪类HACK
(可区分IE和非IE)
IE的所有版本都不支持CSS3 : not() 伪类。有一种变异的HACK使用 : root 伪类，此伪类也同样不被IE识别。

 

6)！Important 怪僻
(适用于IE8以下版本)
IE8及以下版本有一些和!imporant有关的怪僻，它允许一个赋值优先级更高。IE7及更早版本接受任意字符串替代important，并且会正常处理该值，而其它浏览器则会忽略。