网站开发面试题.docxVIP

第 第 PAGE 1 页 共 NUMPAGES 1 页 网站开发面试题 display:inline2.如何解决IE6下的文本溢出BUG(行业内称：多出一只猪)删除2个div之间全部的说明;不设置浮动;调整2个div的宽度，比如将宽度调整为更小一点，刷新页面看效果。3.DIV浮动IE文本产生3象素的bug左边对象浮动，右边采纳外补丁的左边距来定位，右边对象内的文本会离左边有3p*的间距. #bo*{float:left; width:800p*;} #left{ float:left; width:50%;}#right{ width:50%;} *html #left{ margin-right:-3p*; //这句是关键}4.css hack5.假如这道题出的不是IE6 而是让你列举各阅览器之间的兼容性解决方法，就要写死了。。太多太多二、假如让一个div在页面中垂直居中(动动脑子，其实方法许多，各有利弊)1.绝对定位法2.单行垂直居中(重点是里面的文字是单行)div {height:25p*;line-height:25p*;overflow:hidden;}3.多行未知高度文字的垂直居中div {padding:**p*; (谁都会吧)}4.多行文本固定高度的垂直居中 (IE6不能正确地理解display:table和display:table-cell，所以要用css hack，想知道为什么这样做，可以参考div#wrap父容器 {display:table;border:1p* solid #FF0099;background-color:#FFCCFF;width:760p*;height:400p*;_position:relative;overflow:hidden;}div#subwrap子容器 {vertical-align:middle;display:table-cell;_position:absolute;_top:50%;}div#content内容 {_position:relative;_top:-50%;}三、如何让2个并列的div自动等高(不设高度)注：假如能写出3种常见方法当然最好，但最好写一下各自优缺点，否那么面试时确定会问你为什么这样写1、背景模拟法(假高度)，根据尺寸制作背景，平铺，当内容增多时，背景就会向下纵向重复，看起来就向左右两个div都自动向下延伸了一样。2、表格嵌套法(不难理解，表格都是等高的，就是在div中嵌套表格)3、内外补丁法(最推举的方法，由于只用css实现的，但初学者不易理解)* { margin:0; padding:0; }#wrap {overflow:hidden; (这行代码是重点，否那么你会看到页面很长很长)padding:0;padding-left:180p*;(内补丁)}#left,#right {height:auto;margin-bottom:-10000p*;(外补丁)padding-bottom:10000p*;(内补丁)}#left {display:inline;float:left;width:180p*;margin-left:-180p*;(外补丁)background: #0CF;}#right{float:right;width:100%;background: #FC6;}这里说一下内外补丁，其实也没那么难理解，我的理解就是相互抵消。多用用margin负值，你会了解这个原理的。四、宽度自适应三栏的布局方式三种方法：1、绝对定位法(最易理解)左右两栏采纳绝对定位，分别固定于页面的左右两侧，中间的主体栏用左右margin值撑开距离。于是实现了三栏自适应布局。html,body{margin:0; height:100%;}#left,#right{position:absolute; top:0; width:200p*; height:100%;}#left{left:0; background:#a0b3d6;}#right{right:0; background:#a0b3d6;}#main{margin:0 210p*; background:#ffe6b8; height:100%;}2、margin负值法(不易理解)html,body{margin:0; height:100%;}#main{width:100%; height:100%; float:left;}#main #body{margin:0 210p*; ba