![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
css样式问题
jsuzzy
这个作者很懒,什么都没留下…
展开
-
碰到的css样式问题
工作中碰到很多需要解决的样式bug,有一些确实诡异……总结下来就是注意以下几点:1.去除浮动碰到有float属性的层问题,首先看后面的层是不是加了clear属性,尤其在ie6下,还要注意margin加倍问题(margin加倍解决办法是加display:inline;)2.ie6的边线问题有时带边框的层在ie6下显示不连续,刷新也不行,这种原因是没有定义层的宽高,ie默认有个hasl原创 2009-09-15 16:31:00 · 573 阅读 · 0 评论 -
三种实用CSS清除浮动的方法
<br />一、使用空标签清除浮动<br /> 我用了很久的一种方法,空标签可以是div标签,也可以是P标签。我习惯用<div>,够简短,也有很多人用<hr>,只是需要另外为其清除边框,但理论上可以是任何标签。这种方式是在需要清除浮动的父级元素内部的所有浮动元素后添加这样一个标签清楚浮动,并为其定义CSS代码:clear:both。此方法的弊端在于增加了无意义的结构元素。另外,由于ie中,div有个默认高度,为了在所有浏览器下显示效果是一样的,还应该让清除浮动的div高度为0。<br /><s原创 2010-12-20 11:28:00 · 506 阅读 · 0 评论 -
关于button按钮在IE中的宽度问题
Button 在IE中的默认显示与其他浏览器大相径庭,button的文字越长,button的宽度就成比例的放大,padding的设置完全失效。用IE浏览文字很长的button,基本上是场灾难~ 在IE中,button的默认overflow是clip (奇怪的参数),在这种情况下width:auto不起作用,所以加上overflow:visible,搞定!原创 2010-05-12 13:49:00 · 817 阅读 · 0 评论 -
关于ie6下iframe的高度bug
有个三列布局: ......... 样式上已经给三个div加了宽度和左浮动,布局没问题。 程序员要把右面的div用iframe来实现,即把#right的浮动和宽度加到了iframe上面,...放到了iframe里面。如下: ...... ... iframe的高度是由程序来控制的,高度不定。 结果,在ie7及firef原创 2010-03-31 15:54:00 · 2416 阅读 · 0 评论 -
td中内容不换行的解决办法
当td的内容过长时,有时会出现内容不换行问题,导致table溢出容器,样式发生变化。 以前的解决办法是给td加样式word-break:break-all;这个属性虽然能解决ie中出现的问题,但对于firefox却不支持此属性。 经过多次尝试,终于找到了解决的办法: 首先给table加样式table-layout:fixed;原创 2010-03-17 14:33:00 · 7233 阅读 · 0 评论 -
关于type="submit"默认文字问题
想把按钮用图片形式展示,开始写了如下代码: 并对class做了定义:input.reset{ background-image: url(../images/gb/reset.jpg);} 在dreamweaver下看的时候虽然默认有"button”的文字,但运行出来只显示了图片。 把type="button"改为type="submit",运行出来后图片上显示多余原创 2010-03-04 10:56:00 · 14018 阅读 · 0 评论 -
关于firefox不支持text-overflow:ellipsis;的解决办法
text-overflow:clip/ellipsis; 前者clip是默认值,即“不显示省略标记,只是简单的裁切”;后者ellipsis意思是“对象内文本溢出时显示省略标记(...)”。 但是当使用了text-overflow:ellipsis;以后,在ie下显示是正确的,超出部分为省略号...,而在firefox中超出部分却是裁切掉了,这是因为firefox不支持tex原创 2010-02-26 13:58:00 · 5560 阅读 · 4 评论 -
图片在ie6下不显示问题
最近碰到一个奇怪bug:给页面中的按钮(input)增加了背景样式,在ie7/ie8/firefox中都能正常显示背景图片,但在ie6中背景无显示,只是显示成了正常按钮的样子,用调试工具查看ie6下的样式,发现定义背景的css没有引进来,以前也碰到过类似问题,追其原因是因为引用的css文件编码问题。 解决办法:用记事本打开引用的css文件,然后另存,选择UTF-8编码,搞定!原创 2010-01-18 09:29:00 · 3137 阅读 · 0 评论 -
关于table的样式问题
程序员让做一个table的样式,因为没有太多内容变化,就把table以及td列宽都固定了,一切看起来还好。谁知加入数据后完全变了样,td的宽度根本没按设定值来,宽的极其宽,窄的也只能容下一个字,总之,样式全乱了。用调试工具检查样式都没发现问题,程序员把数据去掉,样式又都好了。。。最终在网上发现一个可行的方法,那就是给table加样式word-break:break-all;刷新再看,一切o原创 2009-10-15 11:05:00 · 861 阅读 · 0 评论 -
ie6框架下,出现横向滚动条bug
碰到ie6在框架下出现横向滚动条的问题,其他浏览器都没有这个滚动条。 纠其原因,可能是因为ie6下的宽度没有把竖向的滚动条算进去,所以一旦高度出现滚动条,ie6横向的宽度相当于增加了这个滚动条,进而出现了横向滚动条。而别的浏览器就不会这么计算。解决方法:把出现滚动条的子框架中,在html标签里添加样式:overflow-x:hidden;overflow-y:auto;这样就o原创 2009-09-28 11:37:00 · 1658 阅读 · 0 评论 -
页码在层里居中显示问题
一般情况下,先给页码层设定样式text-align:center; 然后给页码层里的标签设置样式display:inline-block;即可,这是高级浏览器firefox所使用的。而ie不识别display:inline-block;样式,它的解决方法是给页码层里的标签设置样式display:inline,还要设置zoom:1;用来触发ie的layout属性,这样也能达到display:inline-block的效果。原创 2010-11-05 17:25:00 · 1422 阅读 · 0 评论