关于Li的水平布局的总结
来源:广州中睿信息技术有限公司官网
发布时间:2012/10/21 23:25:16 编辑:admin 阅读 465
1,li即使在css-reset的作用下,如果display:inline的情况下,默认的宽高各浏览器不同:Firefox:7*17IE8:7*14IE7:11*14(很不好看)IE9:auto*a

1, li  即使在css-reset的作用下,如果display:inline的情况下,默认的宽高各浏览器不同:

       Firefox: 7*17

       IE8: 7*14

       IE7: 11*14 (很不好看)

       IE9: auto * auto(这个很奇怪,但是显示和IE8相同)

所以鉴于这种情况,我们自定义这个li的宽高吧。但是我们知道,我们display:inline就把它们当做内联元素了,宽高都不起作用。怎么办?

方案有二

A.display:inline; line-height:Value+; margin:Value+; padding: Value+

B. display: inline-block; float:left; width:Value+ ; height:Value+; margin:Value+ ; padding:value+)我推荐使用B方案,兼容性更高。

至于第一种方案,我发现在IE7下的默认高度不给力,在高度上和其他浏览器有差异。这个比较遗憾。

联系我们CONTACT 扫一扫
愿景:成为最专业的软件研发服务领航者
中睿信息技术有限公司 广州•深圳 Tel:020-38931912 务实 Pragmatic
广州:广州市天河区翰景路1号金星大厦18层中睿信息 Fax:020-38931912 专业 Professional
深圳:深圳市福田区车公庙有色金属大厦509~510 Tel:0755-25855012 诚信 Integrity
所有权声明:PMI, PMP, Project Management Professional, PMI-ACP, PMI-PBA和PMBOK是项目管理协会(Project Management Institute, Inc.)的注册标志。
版权所有:广州中睿信息技术有限公司 粤ICP备13082838号-2