1.10. list-style-type, list-style-image, list-style-position

 


Dùng để thiết kế menu cấp 2 dễ dàng hơn

<style type="text/css">
  ol.lower-alpha {
    list-style-type: lower-alpha;
  }
  ul.circle {
    list-style-type: circle;
  }
  ul.square {
    list-style-type: square;
  }  
  ul.ul_image {
    list-style-image: url("http://www.sololearn.com/images/bullet.jpg");
    list-style-position: inside;
    }
  ul.ul_type {
      list-style-type: square;
      list-style-position: outside;
      list-style-image: none;
  }    
   
</style>
<ol class="lower-alpha">
    <li>Red</li>
    <li>Green</li>
    <li>Blue</li>
</ol>
<ul class="circle">
    <li>Red</li>
    <li>Green</li>
    <li>Blue</li>
</ul>
<ul class="square">
    <li>Red</li>
    <li>Green</li>
    <li>Blue</li>
</ul>
<ul class="ul1">
    <li>Red</li>
    <li>Green</li>
    <li>Blue</li>
</ul>
<ul class="ul_image">
    <li>Red</li>
    <li>Green</li>
    <li>Blue</li>
</ul>
<ul class="ul_type">
   <li>Red</li>
   <li>Green</li>
   <li>Blue</li>
</ul>























Nhận xét