不使用jscript注入html

Question

我有以下代码：

<ul id="myList">
   <li class="li1">Example 1</li>
   <li class="li2">Example 2</li>
   <li class="li3">Example 3</li>
   <li class="li4">Example 4</li>
</ul>

有什么方法可以将列表转换为：

<ul class="myList">
   <li class="li1"><div class="container">Example 1</div></li>
   <li class="li2"><div class="container">Example 2</div></li>
   <li class="li3"><div class="container">Example 3</div></li>
   <li class="li4"><div class="container">xample 4</div></li>
</ul>

仅使用css 。 不使用javascript

Answer 1

CSS无法添加元素，这真的不是它的目的。

话虽如此，您可以通过制作项目display: block来实现类似的效果，如下所示：

#myList > li { display: block; }

Answer 2

没有。 CSS旨在指导浏览器了解元素的外观和位置。它无法编辑实时HTML。