1. LI中内容超过长度后以省略号显示的方法 此方法适用与IE与OP浏览器
li{
width:200px;
white-space:nowrap;
text-overflow:ellipsis;
-o-text-overflow:ellipsis;
overflow: hidden;
}
2. div的垂直居中问题 vertical-align:middle;
将行距增加到和整个DIV一样高 line-height:200px;
然后插入文字,就垂直居中了。缺点是要控制内容不要换行
IE需要设定body居中,首先在父级元素定义text-algin: center;
这个的意思就是在父级元素内的内容居中。
3. margin加倍的问题
设置为float的div在ie下设置的margin会加倍。这是一个ie6都存在的bug。
解决方案是在这个div里面加上display:inline;
例如:
<#div id=”imfloat”>
相应的css为
#IamFloat{
float:left;
margin:5px; /*IE下理解为10px*/ display:inline;/*IE下再理解为5px*/}
4.清除层浮动后,后面的层margin-top不起作用
引用
解决办法:可以在浮动层上设置margin-bottom的值 /* IE6下也兼容的*/
5.怎么样才能让层显示在FLASH之上呢 解决的办法是给FLASH设置透明
<param name="wmode" value="transparent" />
6. 游标手指cursor
cursor: pointer 可以同时在 IE FF 中显示游标手指状, hand 仅 IE 可以
7.FireFox下如何使连续长字段自动换行
众所周知IE中直接使用 word-wrap:break-word 就可以了
FF中我们使用JS插入的方法来解决
div {
width:300px;
word-wrap:break-word;
border:1px solid red;
}
<div id="ff">aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</div>
<scrīpt type="text/javascrīpt"> /* <![CDATA[ */ function toBreakWord(el, intLen){ var ōbj=document.getElementById(el); var strContent=obj.innerHTML; var strTemp=""; while(strContent.length>intLen){ strTemp+=strContent.substr(0,intLen)+" "; strContent=strContent.substr(intLen,strContent.length); } strTemp+=" "+strContent; obj.innerHTML=strTemp; } if(document.getElementById && !document.all) toBreakWord("ff", 37); /* ]]> */ </scrīpt>
8.超链接访问过后hover样式就不出现的问题 被点击访问过的超链接样式不在具有hover和active了,很多人应该都遇到过这个问题。
引用
解决方法是改变CSS属性的排列顺序: L-V-H-A
<style type="text/css">
<!-- a:link {} a:visited {} a:hover {} a:active {} --> </style>