كيف أضيف إطار إلى list-style ؟

يمكن إضافة تأثير الإطار عن طريق إضافة خاصية border  إلى عناصر li وبالتحديد border-bottom، بالشكل التالي:

ul {
  list-style: decimal;
  display: inline-block;
}
li {
  background: red;
  list-style-position: inside;
  border-bottom: 1px solid #ccc;
}

عناصر li داخل ul على html:

<ul>
  <li>الأكاديمية</li>
  <li>مستقل</li>
  <li>خمسات</li>
</ul>