<!DOCTYPE html>

 <html>

     <head>

         <meta charset="utf-8">

         <title></title>

         <style>

             .list{

                 margin: 0;

                 padding: 0;

                 list-style: none;

                 width: 300px;

             }

             .list li{

                 height: 30px;

                 border: 1px solid red;

                 line-height: 30px;

                 *vertical-align: top;

             }

             .list li a{

                 float: left;

             }

             .list li span{

                 float: right;

             }

         </style>

         <!--

             解决方案：

                 针对ie6，7添加vertical-align: top;                 *vertical-align: top;

         -->

     </head>

     <body>

         <ul class="list">

             <li>

                 <a href="">左边</a>

                 <span>右边</span>

             </li>

             <li>

                 <a href="">左边</a>

                 <span>右边</span>

             </li>

             <li>

                 <a href="">左边</a>

                 <span>右边</span>

             </li>

             <li>

                 <a href="">左边</a>

                 <span>右边</span>

             </li>

         </ul>

     </body>

 </html>

li里元素都浮动 li 在IE6 7 下方会产生4px间隙问题的更多相关文章

  1. 使用 jQuery对象设置页面中 ＜ul＞ 元素的标记类型，并使用 DOM 对象设置 ＜li＞ 元素的浮动属性和右边距。使用jQuery 对象和 DOM 对象设置页面元素属性

    查看本章节 查看作业目录 需求说明: 使用 jQuery对象设置页面中 <ul> 元素的标记类型,并使用 DOM 对象设置 <li> 元素的浮动属性和右边距.使用jQuery ...

  2. CCS设置第一个li的元素与其他li样式不同

    <div class="ly-content-list"> <ul> <li> <div class="title"& ...

  3. IE6 7下常见CSS兼容性处理

    以下是一些比较常见的IE6 7下的兼容性问题. 在当下这个时代,其实我们几乎可以不用再去针对IE6做兼容性的处理,除非你的公司还是诡异的要求你兼容到IE6.但是了解一些常见的兼容性问题还是可以帮助我们 ...

  4. 当一个元素被浮动后，它的display是否会被默认指定为block?

    css 浮动后的元素不论是什么display的都默认是block就是设置inline也是block IE/6出现双边框的原因 出现双边距的条件是当浮动元素的浮动方向和margin的方向一致时才会出现. ...

  5. li里的a标签浮动了，为什么li本身也浮动了？

    <ul> <li><a href="#"></a></li> <li><a href="#& ...

  6. li下沉 margin-top越界 浮动带来的影响

    使用li嵌套实现的二级导航菜单,在IE浏览器下显示正常,而在谷歌及360极速模式下最后的几个li标签下沉了,其实在webkit内核的浏览器中都会有这种情况,如下图: 出现此种状况,有两种可能: 1.导 ...

  7. 点击每个li节点，都弹出其文本值及修改

    点击每个li节点,都弹出其文本值 1,获取所有的li节点 var liNodes=document.GetElementsByTagName("li"); 2,使用for循环进行遍 ...

  8. 不是什么时候都可以用栈来声明对象并使用（自动释放）——Delphi里到处都是编译器魔法，并且自动帮助实例化界面元素指针

    一直都喜欢这样显示窗口,因为简单高效: void MainWidget::ShowMyWindow() { MyWidget form(this); form.resize(,); form.exec ...

  9. 一句white-space:nowrap解决IE6,IE7下浮动元素不自动换行

    一句white-space:nowrap解决IE6,IE7下浮动元素不自动换行

随机推荐

  1. Linux 格式化分区 报错Could not stat --- No such file or directory 和 partprobe 命令

    分区的过程正常: [root@db1 /]# fdisk -l   Disk /dev/sda: 21.4 GB, 21474836480 bytes 255 heads, 63 sectors/tr ...

  2. hdu_2446_Shell Pyramid(数学，二分)

    题目连接:http://acm.hdu.edu.cn/showproblem.php?pid=2446 题意:题面很大,有用的就那么几句,意思就是用自然数来堆它画的那个金字塔,比如第一个金字塔的第一个 ...

  3. 一篇很全面的freemarker教程 前端工程师必备

    FreeMarker的模板文件并不比HTML页面复杂多少,FreeMarker模板文件主要由如下4个部分组成: 1,文本:直接输出的部分 2,注释:<#-- ... -->格式部分,不会输 ...

  4. s7-300 第一讲

    s7-300的电源模块可选,s7-400必选

  5. iOS9以后 GDataXMLNode修改方式

    iOS9以后GDataXMLNode修改方式

  6. Stm32 Bootloader整理

    Stm32 Bootloader整理 一．        基本概念 1.IAP IAP是In Application Programming的首字母缩写,IAP是用户自己的程序在运行过程中对User ...

  7. kafuka常用的shell命令

    kafka常用shell命令: ------------------------------------ 1.创建topic bin/kafka-topics.sh --create --zookee ...

  8. Spring MVC中前后台数据传输小结

    前台向后台传递参数: @ResponseBody @RequestMapping(value = "/findById/{id}", method = { RequestMetho ...

  9. 优化eclipse

    1.取消自动validation windows–>perferences–>validation 除开Manual下面的复选框全部选中之外,其他全部不选 如需验证,在要验证的文件上,单击 ...

  10. vi编辑器常见命令的使用

    Linux下的文本编辑器有很多种,vi 是最常用的,也是各版本Linux的标配.注意,vi 仅仅是一个文本编辑器,可以给字符着色,可以自动补全,但是不像 Windows 下的 word 有排版功能. ...