Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to get list item (<li>) marker/label declared in list-style-type?

Lets say I have a list like this:

<ul style="list-style-type: upper-latin;">
  <li>Lorem</li>
  <li>Ipsum</li>
</ul>

(list-style-type might be anything - upper-roman, katakana, lower-greek)

list-style-type: upper-latin; will put a alphabet letter (starting from A) in front of every list item. Is there a way to get this letter for any given list item? I can probably iterate over list using jQuery .index() or similar.

Or, maybe there is way to extract markers from style?

The answer here works only for Latin alphabet lists.

like image 635
Sver Avatar asked Oct 25 '12 06:10

Sver


People also ask

Which is a list-style-type marker for bulleted list?

The list-style-position property specifies the position of the list-item markers (bullet points). "list-style-position: outside;" means that the bullet points will be outside the list item. The start of each line of a list item will be aligned vertically.

Which is the default list-style-type of list tag?

The default list-style-type value for an ordered list is decimal , whereas the default for an unordered list is disc .

Which CSS property is used to define style of the list item in unordered list?

CSS list-style-type property.

What is UL LI A in CSS?

<ul>: The Unordered List element. The <ul> HTML element represents an unordered list of items, typically rendered as a bulleted list.


1 Answers

Is there a way to get this letter for any given list item?

Yes. You can read the list-style-type and generate what characters are showing for each style type. Which character is shown for a specific item number and style type could vary across browsers though.

Or, maybe there is way to extract markers from style?

No. (At least not currently)

Some useful stuff for writing a generator:

  • List of Unicode characters
  • List-generator in all list-style-types
  • Numbers to roman numerals in Javascript

Also, many of the list-styles are uppercase versions of other list styles. Could be good to know then that myString.toUpperCase() works on unicode characters as well. :)

like image 182
Jan Avatar answered Oct 11 '22 19:10

Jan