Html 为什么<；李>；下的元素<；部门>；呈现不同于<；李>；下的元素<；ul>；？

我想将li元素临时放置在div 但是我注意到，即使div父元素的样式与原始ul父元素的样式完全相同，元素的渲染也会有所不同。 这种行为有什么原因吗？ 有没有办法用div标签来模拟ul标签

函数复制（）{
var ul=document.getElementById（'real-ul'）；
var div=document.getElementById（'emulate-ul'）；
var cStyle=（window.getComputedStyle）？window.getComputedStyle（ul，null）：ul.currentStyle；
for（cStyle中的var属性）{
div.style[property]=cStyle[property]；
}
}

a项下的第li项

ul下的第li项

复制所有计算样式

在大多数浏览器中，

ul

元素有一些默认的css道具，我认为这是一个准确的列表：

ul { 
    display: block;
    list-style-type: disc;
    margin-top: 1em;
    margin-bottom: 1em;
    margin-left: 0;
    margin-right: 0;
    padding-left: 40px;
}

---

您可以看到，前后的

边距

和

填充开始

造成了这里的差异。我想您可以将它们添加到您的边界

div

中，以重新创建

ul

的样式。如果没有

，您就不会将

元素放在
中

<div>
  <div id="emulate-ul">
    <ul>
     <li>ITEM li under a div</li>
    </ul>
  </div>
  <div id="some-id">
   <ul id="real-ul">
     <li>ITEM li under a ul</li>
   </ul>
  </div>
</div>



a项下的第li项


ul下的第li项

因为它是无效的HTML？你为什么要这样做？如果你想要的只是符号，为什么不使用&bull；我需要暂时将一个现有元素移动到另一个div。即使所有这些道具都应用到div元素上，li元素仍然呈现不同的区域。这并不完全相同，而且很难伪造，因为正如其他人所指出的，这不是有效的HTML。您可以在
div
中有一个空的
ul
，然后将元素移到其中。