[引用]:http://www.meizi.cn/article.asp?id=57
通常我们是这样设置:
#headerLine{margin: 0px; padding: 0px; background: url(dian.gif); height: 1px;width:256px;}
这个在 FireFOX里面有有效果的,可惜在IE里面顶层到不1PX.
那么如何才能在IE中起作用那?下面来看下这个例子.
最好的方法就是在两个DIV之间加一个注释,就像TABLE一样,TABLE的解决办法是把默认的空格去掉或者加一像素图片,那么DIV中我们就可以这样写: <div id="headerLine"><!-- --></div>为什么要加个注释哪?大家可以想想,注释在页面中是不显示的,那么他的默认值就可能为"0".
例1:<div id="headerLine"><!-- --></div>
#headerLine{margin: 0px; padding: 0px; background: url(dian.gif); height: 1px;width:256px;}
另外还有一个解决方法,我们可以设置行高为1像素.因为在不设置的情况下IE的默认行高是1.5也就是15像素.
例2:<div id="headerLine"></div>
#headerLine{margin: 0px; padding: 0px; background: url(dian.gif); line-height: 1px;width:256px;}
最后一个解决办法,就是通过设置overflow(visible | auto | hidden | scroll 注释:hidden :不显示超过对象尺寸的内容.)的原始值来改变它的行高.
例3:<div id="headerLine"></div>
#headerLine{margin: 0px; padding: 0px; background: url(dian.gif); overflow: hidden; height: 1px;width:256px;}
分享到:
相关推荐
设置为float的div在ie下设置的margin会加倍。这是一个ie6都存在的bug。解决方案是在这个div里面加上display:inline; 例如: <#div id=”imfloat”> 相应的css为 #IamFloat{ float:left; margin:5px;/*IE下理解...
<div class="content"> 这是框中的文字,可动态显示。高度自动增加,应该不错吧^_^ <br> <br> <br> <br> <br> <br> <br> <br> <br> <br></div> <i></i> </div> </body...
(30px是与设置的div的高度一样) 怎么样去掉DIV与DIV的空白 状况描述: 1)<div>与<div>之间怎么有一条空白线? 2)div图片与图片之间的空白问题? 3)为什么div与div之间设置了margin:0; 和 padding:0; 但是...
复制代码代码如下: div { position:absolute; width:500px; height:260px; top:50%; left:50%; margin-left:-250px; height:-130px; z-index:1000;...设置显示文字的标签的高和line-height的高一样就行了!
关于css中line-height(行高)设置无效的问题 我们先写下这一串代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style ...
box-shadow:1px -3px 8px 1px #aaa;} .second_line{width:170px;height:1px;top:199.5px;left:180px;background-color:#f60; transform-origin:11.765% 50%;box-shadow:1px -3px 7px 1px #bbb;} .dot_box{width:...
前言在CSS中,line-height 属性设置两段段文本之间的距离,也就是行高,如果我们把一段文本的line-height设置为父容器的高度就可以实现文本垂直居中了,比如下面的例子: 复制代码代码如下:<!DOCTYPE ...
那么你应该把行高设置成170左右(大约是div高度的二倍,具体的可以调,决定行高的主要原因是字体的大小),如果仅仅是这样的话,那么在IE6下就会出现div高度加倍的现象,解决的方法是在div的css样式里面加上overflow...
border-bottom:1px solid #BCD2E6; } #tabs1 ul { margin:0; padding:10px 10px 0 50px; list-style:none; } #tabs1 li { display:inline; margin:0; padding:0; } #tabs1 a { float:left; ...
line-height:+数字+单位(在CSS布局中我们一般采用像素px为单位)行高line-height的值可以为百分比数字 | 由浮点数字和单位标识符组成的长度值,允许为负值。其百分比取值是基于字体的高度尺寸。 二、行高应用介绍 ...
1.div中单行文字垂直水平居中。条件:外层div高度已经给定。代码如下: 复制代码代码如下: <style type=”text/css”> .div3{ border:1px solid red; text-align:center; height:200px; line-height:200px; ...
2.line-height指的是在DIV中的元素上下居中 比如用在里,则可以将line-height的高度和height的值相等,(height:30px; line-height:30px;)这样可以让文字在内相对于30px垂直居中。比如用在内,像这样成段落的,如果...
设置为float的div在ie下设置的margin会加倍。这是一个ie6都存在的bug。 解决方案是在这个div里面加上display:inline; 例如: <#div id=”imfloat”> 相应的css为 #IamFloat { float:left; margin:5px;/*IE下...
div假分页原理:填充后div的总高度 (1000px) 显示高度(100px) 则页面总数为10页 。当查看第二页时,显示的div高度为100 – 200之间,以此类推 看见页面在翻页 实则为div滚动条移动。 <div id=applications>显示...
静态网业模板,关于花卉的 body { background-color:#c0c0c0; font-family:Arial, Helvetica, sans-serif; padding:0; font-size:12px;...margin:0px auto auto auto;...padding:5px 0 5px 0;...border: 1px solid #...
border: 1px #9999cc dashed;/*边框类型*/ margin: 5px; /*内间距*/ } p{ font-size: 12px; text-indent: 2em; /*首行缩进*/ line-height: 1.5; /*行高*/ padding: 5px; /*外间距*/ } body{ margin:...
line-height: 160%; } ul, ol { } a { color: #0098A4; } a:hover { text-decoration: none; } .alignleft { float: left; } .alignright { float: right; } .aligncenter { margin: 0px auto; } img.alignleft { ...
border-bottom:1px solid #e6e6e6}.bdsug-ala h3{line-height:14px;background:url(//www.baidu.com/img/sug_bd.png) no-repeat left center;margin:6px 0 4px 0;font-size:12px;font-weight:normal;color:#7b7b7b;...
复制代码代码如下: div { background:red; line-height:1px; } IE6下这个问题是因为默认的行高造成的,解决的方法也有很多 例如: 复制代码代码如下: overflow:hidden; zoom:0.08; line-height:1px;
要加上line-height,并且加上 <!DOCTYPE ...复制代码代码如下: #div-a{ height:60px; line-height:60px; } XHTML代码: 复制代码代码如下: <div id=”div-a”> 软件开发网 </div>