2. FireFox下如何使连续长字段自动换行

??? Js代码

????<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);???? ?
????/*?]]>?*/??? ?
????</script>?

3.ff下为什么父容器的高度不能自适应

4.IE6的双倍边距BUG
? 浮动后本来外边距10px,但IE解释为20px,解决办法是加上

display:?inline?

5. IE6下绝对定位的容器内文本无法正常选择
?? 此问题在IE6、7中存在,解决问题的办法是让IE进入到qurks mode。关于qurks mode的相关知识,请参考:

10.web标准中定义id与class有什么区别吗

12.如何对齐文本与文本输入框
? 加上 vertical-align:middle;?

<style?type="text/css"> ?
??<!--? ?
???input?{ ?
?????width:200px; ?
?????height:30px; ?
?????border:1px?solid?red; ?
?????vertical-align:middle; ?
???}? ?
??--> ?
</style> ?

?

13.FF下面不能水平居中呢

14.FF下文本无法撑开容器的高度

15.IE6下容器的宽度和FF解释不同呢?

<?xml?version="1.0"?encoding="gb2312"?>?
<!DOCTYPE?html?PUBLIC?"-//W3C//DTD?XHTML?1.0?Strict//EN"?"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">?
<meta?http-equiv="Content-Type"?content="text/html;?charset=gb2312"?/>?
????<style?type="text/css">?
????<!-- ?
????div{ ?
????????cursor:pointer; ?
????????width:200px; ?
????????height:200px; ?
????????border:10px?solid?red ?
????} ?
????-->?
????</style>?
<div?ōnclick="alert(this.offsetWidth)">web标准常见问题大全</div>?

问题的差别在于容器的整体宽度有没有将边框（border）的宽度算在其内,这里IE6解释为200PX ,而FF则解释为220PX,那究竟是怎么导致的问题呢？大家把容器顶部的xml去掉就会发现原来问题出在这,顶部的申明触发了IE的qurks mode,关于qurks mode、standards mode的相关知识,请参考:?
???

17.??? 为什么我定义的样式没有作用呢

18.??? IE6无法定义1px左右高度的容器

19.??? 背景颜色无法显示?

<!DOCTYPE?html?PUBLIC?"-//W3C//DTD?XHTML?1.0?Strict//EN"?"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">?
<meta?http-equiv="Content-Type"?content="text/html;?charset=gb2312"?/>?
<style?type="text/css">?
<!--? ?
ul?{ ?
????????background:red ?
????} ?
li?{ ?
????????float:left; ?
????????width:180px; ?
????} ?
-->?
</style>?
<!--[if?lte?IE?6]>?
<style>?
.gainlayout?{?height:?1px;?} ?
</style>?
<![endif]-->?? ?
<ul?class="gainlayout">?
<li>web标准常见问题大全</li>?
<li>web标准常见问题大全</li>?
<li>web标准常见问题大全</li>?
<li>web标准常见问题大全</li>?
<li>web标准常见问题大全</li>?
<div?style="clear:both"></div>?
</ul>?

IE中设置有背景色的ul并没有显示出来,这个属于haslayout问题,解决的办法也很多参考http://www.satzansatz.de/cssd/onhavinglayout.htm

20.??? 怎么样才能让层显示在FLASH之上呢
??? 解决的办法是给FLASH设置透明?

<param?name="wmode"?value="transparent"?/>??

21.??? 怎样使一个层垂直居中于浏览器中
??? 这里我们使用百分比绝对定位,与外补丁负值的方法,负值的大小为其自身宽度高度除以二?

<style?type="text/css">???? ?
<!--????? ?
div?{???? ?
????????position:absolute;???? ?
????????top:50%;???? ?
????????left:50%;???? ?
????????margin:-100px?0?0?-100px;???? ?
????????width:200px;???? ?
????????height:200px;???? ?
????????border:1px?solid?red;???? ?
????}???? ?
-->???? ?
</style> ?

22.??? 图片垂直与容器内?

<!DOCTYPE?html?PUBLIC?"-//W3C//DTD?XHTML?1.0?Transitional//EN"?"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">?
<style?type="text/css">?
<!--? ?
*?{margin:0;padding:0} ?
div?{ ?
????????width:500px; ?
????????height:500px; ?
????????border:1px?solid?#ccc; ?
????????overflow:hidden; ?
????????position:relative; ?
????????display:table-cell; ?
????????text-align:center; ?
????????vertical-align:middle ?
????} ?
div?p?{ ?
????????position:static; ?
????????+position:absolute; ?
????????top:50% ?
????} ?
img?{ ?
????????position:static; ?
????????+position:relative; ?
????????top:-50%;left:-50%; ?
????????width:276px; ?
????????height:110px ?
????} ?
-->?
</style>?
<div><p><img?src="logo.gif"?/></p></div>?

或者使用背景图的办法:?

background:url("logo.gif")?center?no-repeat;?

23.??? 如何让div横向排列
??? 横向排列DIV可以使用浮动的方式比如float:left,或者设置对象为内联,还可以绝对定位对象等等.?

<!DOCTYPE?html?PUBLIC?"-//W3C//DTD?XHTML?1.0?Strict//EN"?"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">???? ?
<meta?http-equiv="Content-Type"?content="text/html;?charset=gb2312"?/>???? ?
<style?type="text/css">???? ?
<!--????? ?
div?{???? ?
????????float:left; ?
????????width:200px; ?
????????height:200px; ?
????????border:1px?solid?red ?
????} ?
-->?
</style>?
<div>web标准常见问题大全</div>?
<div>web标准常见问题大全</div>?
?
?
<div>web标准常见问题大全</div>?

24? Firefox 关于DIV高度无法自适应的两种解决
??? 如果设置了一个DIV的高度，当DIV里实际内容大于所设高度，ie会自动拉伸以适应DIV容器大小，ff会固—IV的高度，超过部分超出DIV底线以外，
??? 出现和下面的内容重叠的现象。如果不给DIV设置高度，在Firefox中将不回因为里面的内容而撑开，而IE中就会自动根据内容撑开
??? 解决方案：
??? 1、在DIV内部的最后追加clear:both样式

<div?style="background-color:#FF0000;">?
????<div?style="float:left;?height:200px">Jmedia?Design</div>?
????<div?style="float:right;?height:800px">www.jmedia.cn</div>?
????<div?style="clear:both"></div>?
</div>?

??? 2、对DIV使用overflow:auto；

<div?style="overflow:auto;">?
????<div?style="float:left;?background-color:#000000;height:200px">1111111111</div>?
????<div?style="float:right;background-color:#000000;?height:300px"">2222222222</div>?
</div>?