在360浏览器中list-style-image发生右移问题
来源:互联网 发布:淘宝网商城儿童女装 编辑:程序博客网 时间:2024/06/07 00:44
网站有几个兼容性问题没有做好,在部分浏览器里显示效果不太友好,由于没有造成很严重的显示后果,所以一直懒得做兼容性优化。最近闲来无事,先解决第一个问题:在部分浏览器(IE)中list-style-image不能正常显示图片。
没有办法,只能用IE的F12开发者工具采用删减排除法来找到问题的根本原因,最后发现是float的问题。
查找资料解释如下:list-style是display为list-item的元素才能使用,而使用了float属性之后,display的属性值便不再是list-item,而是生成了一个块级框,所以list-style和float同时使用就会造成list-style设置的属性值没有效果。
解决方法很简单,用background:url(../img.png) no-repeat;来代替list-style-image即可,所有浏览器都兼容background元素,可根据页面需要,将background的位置进行调整。
阅读全文
0 0
- 在360浏览器中list-style-image发生右移问题
- CSS列表属性list-style-type 和 list-style-image
- 让 list-style-image 图片垂直居中
- list-style-image 图片垂直居中
- list-style-image 在IE下设置float浮动后便不再正常显示
- 列表属性list-style-type、图像符号list-style-image、列表缩进list-style-position
- 右击选择“在浏览器中查看”的选项配置
- 在浏览器中输入网址后都发生了什么
- 在浏览器中输入网址后都发生了什么
- 在浏览器中输入网址后都发生了什么
- 在浏览器中输入网址后都发生了什么
- 当在浏览器中输入url地址后会发生?
- 在浏览器中输入网址后都发生了什么
- 在浏览器中输入一个网址后,发生了什么?
- 解决IE浏览器li下list-style-type无效的问题
- 部分IE浏览器下LI设置list-style-type:none依然占位置问题的解决
- 解决IE浏览器li下list-style-type无效的问题
- 运行第一个 docker image 并在浏览器中查看
- domain specific language
- POJ2031 Building a Space Station
- 百练_2700:字符替换
- C++ QT中namespace使用?
- 堆和栈
- 在360浏览器中list-style-image发生右移问题
- R语言学习-问题解决-reached getOption("max.print")
- 方法调用实例
- C++ function、bind以及lamda表达式
- [牛客网]错题整理(3)
- TortoiseSVN----看不到日志,显示1970-01-01
- Just test the blog
- 初学注意
- ping命令的简单测试及应用