平时为了写某个js效果,从而忽略了标签的嵌套 从而导致了IE6-7混乱,在ul下,直接嵌套div,在ie7以前版本,会出现的状况是:div会被离它最近的li包裹住。 
请看dome

<ul class="clearfix" >
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
<div class="add">
<!--这一块在ie7及之前版本会被加载到文本为5的li里。-->
</div>
</ul>

CSS

<style type="text/css">
.clearfix{ display:inline-block; width:100%; }
.clearfix li{ float:left; padding:5px; border:1px solid #999; width:12%; list-style:none; }
.add{ background:#67BCD1; height:20px;}
</style>

在谷歌下 
 
在ie7文档模式下,就把div添进了离它最近的li里面。 
 
so, ul不支持直接嵌套div的写法。

ul里不能直接嵌套div(在ie7以前版本)的更多相关文章

  1. ie7中ul不能嵌套div和li平级

    我要讲一个忧伤的故事,本以为清晰的层次结构,ul里不能嵌套div和li平级,不然会乱乱乱! 代码: <ul class="catshow">              ...

  2. HTML里为什么不能在<p>标签中嵌套<div>标签

    学习过HTML语言的人都应该知道,在HTML里,有分块级元素和内联元素:例如我们常用到的div,o,ul,dl,table,h1...h6等,这些都是块级元素:而像a,b,i,em,img,span等 ...

  3. p标签里面不能嵌套div

    先申明本人代码水平为零起点,刚开始学习前端,所以就是小白.不过大神也是小白变身的么,所以要专心码代码,潜心钻研,haha~ 今天练习了段代码,发现效果和自己想象的不一样: 想了一下估计是<p&g ...

  4. p标签内不能嵌套div(注解)

    相关知识: 内联元素可以嵌套内联元素,块级元素可以嵌套部分块级元素并也能嵌套内联元素,但内联元素不能嵌套块级元素.块级元素为block,内联元素为inline,拥有“inline”特性的同时又拥有“b ...

  5. 关于p标签不能嵌套div标签引发的标签嵌套问题总结

    问题由来:<p>中嵌套<div>标签,两个都是块级元素,按理应该可以正常显示,但是最后的结果居然是多出来一段<p>的效果,所以就在网上找了许多关于标签嵌套规则的资料 ...

  6. 嵌套div的margin-top不生效

    之前遇到过嵌套div设置margin-top不生效的情况,一直没去研究,今天又遇到了,查阅资料得知原因,并不是margin-top没生效,只是当外层容器跟内层容器之间没有别的元素的时候,内层容器的ma ...

  7. div中嵌套div中使用margin-top失效问题

    div中嵌套div中使用margin-top失效问题

  8. HTML中div嵌套div的margin不起作用

    下面介绍一下div嵌套div时margin不起作用的解决方案. 顺便科普下margin的定义和用法. div嵌套的HTML代码: <!DOCTYPE html> <html lang ...

  9. 嵌套div的onClick事件问题

    嵌套div的onClick事件问题我在下面的代码中的外层div中加了onClick事件,这样当鼠标点击这个div的时候就会跳转了.但是我在图片上加了一些其他效果,所以当鼠标点击中间的img时不能触发跳 ...

随机推荐

  1. Codeforces.1040E.Network Safety(思路 并查集)

    题目链接 \(Description\) 有一张\(n\)个点\(m\)条边的无向图,每个点有点权.图是安全的当且仅当所有边的两个端点权值不同.保证初始时图是安全的. 现在有权值为\(x\)的病毒,若 ...

  2. WEB应用从服务器主动推送Data到客户端有那些方式?

    1)  html5 websocket 2)  WebSocket 通过 Flash 3)  XHR长时间连接 4)  XHR Multipart Streaming 5)  不可见的Iframe 6 ...

  3. Codeforces Round #398 (Div. 2) A. Snacktower 模拟

    A. Snacktower 题目连接: http://codeforces.com/contest/767/problem/A Description According to an old lege ...

  4. UVALive 6908 Electric Bike dp

    Electric Bike 题目连接: https://icpcarchive.ecs.baylor.edu/index.php?option=com_onlinejudge&Itemid=8 ...

  5. ORA-01591 锁定已被有问题的分配事务处理--解决方法(转)

    转载自love wife & love life —Roger 的Oracle技术博客 本文链接地址: ORA-01591: lock held by in-doubt distributed ...

  6. Windows 7重启后USB 3.0无法使用的问题解决

    1.首先对主板USB3.0驱动程序进行重新安装 2.如果驱动程序重装后还是无法解决无法使用USB3.0设备的话,在win7桌面上找到“计算机”图标并鼠标右键,选择“管理”选项,找到设备管理器,然后找到 ...

  7. 开源 java CMS - FreeCMS2.2 菜单管理

    项目地址:http://www.freeteam.cn/ 菜单管理 FreeCMS在设计时定位于面向二次开发友好,所以FreeCMS提供了菜单管理功能.二次开发者能够自由添加新的功能菜单到FreeCM ...

  8. delphi DockPresident

    作为Delphi的忠实用户,我想大家对Delphi中的停靠窗体应该比较熟悉吧,是不是也希望自己编的程序也具有这样的功能?使她看起来更漂亮,更专业,更方便. 本人做的一套停靠控件DockPresiden ...

  9. Windows Phone本地数据库(SQLCE):3、[table]attribute(翻译) (转)

    这是“windows phone mango本地数据库(sqlce)”系列短片文章的第三篇. 为了让你开始在Windows Phone Mango中使用数据库,这一系列短片文章将覆盖所有你需要知道的知 ...

  10. Mybatis-Plus 多表联查分页

    原文:https://www.jianshu.com/p/759b6430ed5b 分析 使用的工程,依旧是 spring-boot,关于分页,官网给出了一个单表的 demo,其实多表分页实现原理相同 ...