Web Design Guide 2023-12-11 10:29:21 | 2.0.0

Lists 

<ul>
    <li>Integer sed mi interdum, mattis neque at, consectetur odio.</li>
    <li>Sed vitae lorem non felis interdum rutrum non vel eros.
        <ul>
            <li>Cras eu nulla a ipsum congue dignissim et nec enim.</li>
            <li>Morbi a augue non purus ornare imperdiet non ut ex.</li>
        </ul>
    </li>
    <li>Duis a eros vestibulum, consequat nunc et, tincidunt tortor.</li>
    <li>Ut id dolor viverra, tempus nisi eu, congue dui.
        <ol>
            <li>Cras eu nulla a ipsum congue dignissim et nec enim.</li>
            <li>Morbi a augue non purus ornare imperdiet non ut ex.</li>
        </ol>
    </li>
    <li>Aenean at lacus quis ex lacinia molestie.</li>
</ul>

<ol>
    <li>Integer sed mi interdum, mattis neque at, consectetur odio.</li>
    <li>Sed vitae lorem non felis interdum rutrum non vel eros.
        <ol>
            <li>Cras eu nulla a ipsum congue dignissim et nec enim.</li>
            <li>Morbi a augue non purus ornare imperdiet non ut ex.</li>
        </ol>
    </li>
    <li>Duis a eros vestibulum, consequat nunc et, tincidunt tortor.</li>
    <li>Ut id dolor viverra, tempus nisi eu, congue dui.
        <ul>
            <li>Cras eu nulla a ipsum congue dignissim et nec enim.</li>
            <li>Morbi a augue non purus ornare imperdiet non ut ex.</li>
        </ul>
    </li>
    <li>Aenean at lacus quis ex lacinia molestie.</li>
</ol>

<pre class="code-preview">&lt;ul&gt;
  &lt;li&gt;Integer sed mi interdum
    &lt;ul&gt;
      &lt;li&gt;Cras eu nulla a ipsum&lt;/li&gt;
    &lt;/ul&gt;
  &lt;/li&gt;
  &lt;li&gt;Sed vitae lorem non felis interdum rutrum non vel eros&lt;/li&gt;
&lt;/ul&gt;
&lt;ol&gt;
  &lt;li&gt;Integer sed mi interdum
    &lt;ol&gt;
      &lt;li&gt;Cras eu nulla a ipsum&lt;/li&gt;
    &lt;/ol&gt;
  &lt;/li&gt;
  &lt;li&gt;Sed vitae lorem non felis interdum rutrum non vel eros&lt;/li&gt;
&lt;/ol&gt;
</pre>
 
<ul>
  <li>Integer sed mi interdum, mattis neque at, consectetur odio.</li>
  <li>Sed vitae lorem non felis interdum rutrum non vel eros.
    <ul>
      <li>Cras eu nulla a ipsum congue dignissim et nec enim.</li>
      <li>Morbi a augue non purus ornare imperdiet non ut ex.</li>
    </ul>
  </li>
  <li>Duis a eros vestibulum, consequat nunc et, tincidunt tortor.</li>
  <li>Ut id dolor viverra, tempus nisi eu, congue dui.
    <ol>
      <li>Cras eu nulla a ipsum congue dignissim et nec enim.</li>
      <li>Morbi a augue non purus ornare imperdiet non ut ex.</li>
    </ol>
  </li>
  <li>Aenean at lacus quis ex lacinia molestie.</li>
</ul>

<ol>
  <li>Integer sed mi interdum, mattis neque at, consectetur odio.</li>
  <li>Sed vitae lorem non felis interdum rutrum non vel eros.
    <ol>
      <li>Cras eu nulla a ipsum congue dignissim et nec enim.</li>
      <li>Morbi a augue non purus ornare imperdiet non ut ex.</li>
    </ol>
  </li>
  <li>Duis a eros vestibulum, consequat nunc et, tincidunt tortor.</li>
  <li>Ut id dolor viverra, tempus nisi eu, congue dui.
    <ul>
      <li>Cras eu nulla a ipsum congue dignissim et nec enim.</li>
      <li>Morbi a augue non purus ornare imperdiet non ut ex.</li>
    </ul>
  </li>
  <li>Aenean at lacus quis ex lacinia molestie.</li>
</ol>

{{render '@helper-code-preview' _self.context}}
 
{
  "snippet": [
    "<ul>",
    "  <li>Integer sed mi interdum",
    "    <ul>",
    "      <li>Cras eu nulla a ipsum</li>",
    "    </ul>",
    "  </li>",
    "  <li>Sed vitae lorem non felis interdum rutrum non vel eros</li>",
    "</ul>",
    "<ol>",
    "  <li>Integer sed mi interdum",
    "    <ol>",
    "      <li>Cras eu nulla a ipsum</li>",
    "    </ol>",
    "  </li>",
    "  <li>Sed vitae lorem non felis interdum rutrum non vel eros</li>",
    "</ol>"
  ]
}

There are no notes for this item.