HTML的一些小积累

1.   position:absolute

 

使用 position:absolute 的元素，如果它的父节点没有使用position:relative的话，它自己的绝对定位就是相对于整个文档的。

它的父节点使用position:relative 或者 position:fixed，那么他的绝对定位就是相对于它的父节点的。

 

2. 让所有字符大写：

text-transform: uppercase;  

 

 

3. 让字符有阴影效果：

text-shadow: 2px 2px 0 #666;

  

4. 当一个父元素<div id="wrap">里面添加两个子元素，想要他们一个float:left, 一个float:right的时候，会出现

父元素的高度失效问题， 没法正常显示，所以要加一个所有浏览器都通用的css：

 

 

group:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
.group { display: inline-block; clear: both; }
/* start commented backslash hack \*/ * html .group { height: 1%; } .group { display: block; } /* close commented backslash hack */
 
<div id="wrap" class="group">
<div style="float:left"></div>
<div style="float:right"></div>
</div>
 

  

5.去掉li前面的小点：

ul{
list-style:none;
}

  

6.safari中查看网页源代码的热键：

mac: cmd+opt+u
win: ctrl+alt+U

  

7.让IE浏览器 使用兼容性模式

 <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
 <meta http-equiv="X-UA-Compatible" content="IE=7" />

 

注意的是 这个可以生效  

但如果是网页中使用iframe，

<frameset cols="*,141" frameborder="NO" border="0" framespacing="0" id="allFrame"> 
   <frameset rows="180,*" frameborder="no" border="0" framespacing="0"> 
     <frame name="topFrame" scrolling="NO" noresize src="test1.jsp" >
     <frame name="mainFrame" src="test2.jsp"/>
  </frameset>
  <frame src="rightJsp.jsp" scrolling="No" noresize="noresize" id="menuFrame"/>
</frameset>

  

那么注意要让  所有的iframe网页中都要这么使用，ie才会生效，如果这是一个iframe里这么使用，ie不会生效。