3

たとえば、次のような構造があります。

<Ul>
<div>heading</div>
<li>dynamic content</li>
<li>dynamic content</li>
<li>dynamic content</li>
<div>heading</div>
<li>dynamic content</li>
<li>dynamic content</li>
</Ul>

ここでコンテンツは動的で、ラッパー div を追加しheadingてコンテンツをフォローする必要があります。このようなものです。

<div class="wrap">
<div>heading</div>
<li>dynamic content</li>
<li>dynamic content</li>
<li>dynamic content</li>
</div>
4

3 に答える 3

2

DIV を使用して LI をラップする代わりに、見出しとして表示する各 LI にクラスを追加することを検討してください。

<style>
.heading
{
 font-weight:bold;
}
</style>

<Ul>
<li class="heading">heading</li>
<li>dynamic content</li>
<li>dynamic content</li>
<li>dynamic content</li>
<li class="heading">heading</li>
<li>dynamic content</li>
<li>dynamic content</li>
</Ul>
于 2012-02-06T21:24:21.670 に答える
0

あなたがしているのは間違ったマークアップですulタグは直接の子としてliタグのみを含むことができます

<Ul>
<li><div>heading</div></li>//Enclose in an li tag
<li>dynamic content</li>
<li>dynamic content</li>
<li>dynamic content</li>
<li><div>heading</div></li>//Enclose in an li tag
<li>dynamic content</li>
<li>dynamic content</li>
</Ul>

あるいは

<div>heading</div>
<Ul>
<li>dynamic content</li>
<li>dynamic content</li>
<li>dynamic content</li>
<li>dynamic content</li>
<li>dynamic content</li>
</Ul>

編集：

これを容器に包むには

<div class="wrap">
<div>heading</div>
<Ul>
<li>dynamic content</li>
<li>dynamic content</li>
<li>dynamic content</li>
<li>dynamic content</li>
<li>dynamic content</li>
</Ul>
</div>
于 2012-02-06T06:09:34.830 に答える
0

よりセマンティックなネストされたリストにする

<Ul class="wrap">
  <li>heading
    <Ul>
      <li>dynamic content</li>
      <li>dynamic content</li>
      <li>dynamic content</li>
      <li>dynamic content</li>
      <li>dynamic content</li>
    </Ul>
  </li>
</Ul>
于 2015-09-27T08:10:05.837 に答える