目录如下:
1.超链接访问过后hover样式就不出现的问题
2.FF下如何使连续长字段自动换行
3.ff下为什么父容器的高度不能自适应
4. IE6的双倍边距BUG
5. IE6下绝对定位的容器内文本无法正常选择的问题
6. IE6下为什么图片下方有空隙产生
7. IE6下这两个层中间怎么有间隙
8. list-style-image无法准确定位的问题
9. LI中内容超过长度后以省略号显示的方法
10.web标准中定义id与class有什么区别吗
11.如何垂直居中文本
12.如何对齐文本与文本输入筐
13.为什么FF下面不能水平居中呢
14.为什么FF下文本无法撑开容器的高度
15.为什么IE6下容器的宽度和FF解释不同呢
16.为什么web标准中IE无法设置滚动条颜色了
17.为什么我定义的样式没有作用呢
18.为什么无法定义1px左右高度的容器
19.为什么这个背景颜色无法显示
20.怎么样才能让层显示在FLASH之上呢
21.怎样使一个层垂直居中于浏览器中
22.通用的加入收藏夹代码
23.javascript为FF设置首页
24.IE6使用滤镜使PNG图片透明后,容器内链接失效的问题
解决方案:
1.被点击访问过的超链接样式不在具有hover和active了,很多人应该都遇到过这个问题,解决方法是改变CSS属性的排列顺序: L-V-H-A
2.众所周知IE中直接使用 word-wrap:break-word 就可以了, 这里FF中我们使用JS插入 的方法来解决
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 2 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh" lang="zh"> 3 <head profile="http://www.w3.org/2000/08/w3c-synd/#"> 4 <meta http-equiv="content-language" content="zh-cn" /> 5 <meta http-equiv="content-type" content="text/html;charset=gb2312" /> 6 <title>blueidea</title> 7 <style type="text/css"> 8 /*<![CDATA[*/ 9 div { 10 width:300px; 11 word-wrap:break-word; 12 border:1px solid red; 13 } 14 15 /*]]>*/ 16 </style> 17 </head> 18 <body> 19 20 <div id="ff">aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</div> 21 22 23 <script type="text/javascript"> 24 // <![CDATA[ 25 26 function toBreakWord(intLen){ 27 var obj=document.getElementById("ff"); 28 var strContent=obj.innerHTML; 29 var strTemp=""; 30 while(strContent.length>intLen){ 31 strTemp+=strContent.substr(0,intLen)+" "; 32 strContent=strContent.substr(intLen,strContent.length); 33 } 34 strTemp+=" "+strContent; 35 obj.innerHTML=strTemp; 36 } 37 if(document.getElementById && !document.all) toBreakWord(37) 38 // ]]> 39 </script> 40 </body> 41 </html>
3. style="clear:both 这个属性就不用说了吧 ,清除浮动而已。
4.解决办法是加上display:inline
5.
上面的问题在IE6、7中存在,解决问题的办法是让IE进入到quirks mode。关于quirks mode的相关知识,请参考:http://www.microsoft.com/china/msdn/library/webservices/asp.net/ASPNETusStan.mspx?mfr=true
- aoao:在IE6版本是6.0.2900.2180.xpsp_sp2.gdr.070227-2254好像依然存在问题,加了背景色依然无效。接着测试中。。。
6.
- 解决这个BUG的方法也有很多,可以是改变html的排版,或者定义img 为display:block
- 或者定义vertical-align属性值为vertical-align:top | bottom |middle |text-bottom
- 还可以设置父容器的字体大小为零,font-size:0
7,。给同级div增加 float属性;
8. position:relative;
9 .text-overflow:ellipsis; 不折行的话 加个 white-space:nowarp; 这个属性好像是css3的;
10.这个问题可以忽略不计,大家都懂,我也没必要装B;
11.text-alight===height(只要等于你设置的高就可以了);
12. vertical-align:middle;
13 margin:auto; padding:auto;
14.
1 { 2 3 height:auto!important; 4 5 height:200px; 6 7 min-height:200px;//ie6好像不支持这个 min-height 8 9 }
15 参见http://www.microsoft.com/china/msdn/library/webservices/asp.net/ASPNETusStan.mspx?mfr=true
16.
1 //将body换成html 即可 2 body { 3 scrollbar-face-color:#f6f6f6; 4 scrollbar-highlight-color:#fff; 5 scrollbar-shadow-color:#eeeeee; 6 scrollbar-3dlight-color:#eeeeee; 7 scrollbar-arrow-color:#000; 8 scrollbar-track-color:#fff; 9 scrollbar-darkshadow-color:#fff; 10 }
17. ×查看优先权书写是否正确
18.IE6下这个问题是因为默认的行高造成的,解决的方法也有很多,例如:overflow:hidden | zoom:0.08 | line-height:1px
19.地址http://bbs.blueidea.com/viewthread.php?tid=2636904,很长,我表示没看完;
20.解决的办法是给FLASH设置透明<param name="wmode" value="transparent" />或者<param name="wmode" value="opaque" />
21.使用百分比绝对定位,与外补丁负值的方法,负值的大小为其自身宽度高度除以二
22
1 <script type="text/javascript"> 2 // <![CDATA[ 3 function bookmark(){ 4 var title=document.title 5 var url=document.location.href 6 if (window.sidebar) window.sidebar.addPanel(title, url,""); 7 else if( window.opera && window.print ){ 8 var mbm = document.createElement('a'); 9 mbm.setAttribute('rel','sidebar'); 10 mbm.setAttribute('href',url); 11 mbm.setAttribute('title',title); 12 mbm.click();} 13 else if( document.all ) window.external.AddFavorite( url, title); 14 } 15 // ]]> 16 </script> 17 18 <a href="javascript:bookmark()">加入收藏夹</a>
23
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 2 <script type="text/javascript"> 3 // <![CDATA[ 4 function setHomePage(){ 5 if(window.netscape){ 6 try { 7 netscape.security.PrivilegeManager.enablePrivilege("UniversalXPConnect"); 8 } 9 catch (e) {}} 10 var prefs = Components.classes['@mozilla.org/preferences-service;1'].getService(Components.interfaces.nsIPrefBranch); 11 prefs.setCharPref('browser.startup.homepage','http://www.blueidea.com'); 12 } 13 // ]]> 14 </script> 15 16 <a href="#" onclick="setHomePage()">设置首页</a>
24
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 2 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh" lang="zh"> 3 <head profile="http://www.w3.org/2000/08/w3c-synd/#"> 4 <meta http-equiv="content-language" content="zh-cn" /> 5 <meta http-equiv="content-type" content="text/html;charset=gb2312" /> 6 <title>blueidea</title> 7 <style type="text/css"> 8 /*<![CDATA[*/ 9 div { 10 width:401px; 11 height:223px; 12 filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod='scale', src='http://bbs.blueidea.com/attachments/2006/9/11/bg_nT9Vi2i45To0.png') 13 } 14 15 /*]]>*/ 16 </style> 17 </head> 18 <body> 19 20 21 <div><a href="#">27.IE6使用滤镜使PNG图片透明后,容器内链接失效的问题。</a></div> 22 23 24 </body> 25 </html>