title: Why do we not get bullet points once we add images in the list items in an unordered list in css?
body: <p>Below is the code I have written. And once I saw the result in the browser, I realized that the bullet points are missing in front of the images I got. But we usually get bullet points when we type text in the 'li' tags of an unordered list.</p>
  <p>Why does this happen? And when designing a web page, is it necessary for me to use the <code>list-style:none</code> property since bullet points are already not visible? Thank you.</p>
  <p>Code:</p>
  <pre class="lang-html prettyprint-override"><code>&lt;ul&gt;
      &lt;li&gt;
          &lt;figure&gt;
              &lt;img src=&quot;resources/img/1.jpg&quot; alt=&quot;Korean bibimbap with egg and vegetables&quot;&gt;
          &lt;/figure&gt;
      &lt;/li&gt;
      &lt;li&gt;
          &lt;figure&gt;
              &lt;img src=&quot;resources/img/2.jpg&quot; alt=&quot;Simple italian pizza with cherry tomatoes&quot;&gt;
          &lt;/figure&gt;
      &lt;/li&gt;
      &lt;li&gt;
          &lt;figure&gt;
              &lt;img src=&quot;resources/img/3.jpg&quot; alt=&quot;Chicken breast steak with vegetables&quot;&gt;
          &lt;/figure&gt;
      &lt;/li&gt;
      &lt;li&gt;
          &lt;figure&gt;
              &lt;img src=&quot;resources/img/4.jpg&quot; alt=&quot;Autumn pumpkin soup&quot;&gt;
          &lt;/figure&gt;
      &lt;/li&gt;
  &lt;/ul&gt; 
  </code></pre>