Jump to content
Penny

Help with HTML lists please

Recommended Posts

Hi

Raw beginner here.

I'm looking at <ul> and <ol> and wondering why there is a difference in how the style is coded in the examples given:

<ul style="list-style-type:disc;">

<ol type="A">

Are these interchangeable or is there a reason why they're different? 

Thanks

 

Share this post


Link to post
Share on other sites

They work the same, but it preferable to use CSS as mentioned on MDN: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/ol

Quote

Unless the type of the list number matters (like legal or technical documents where items are referenced by their number/letter), use the CSS list-style-type property instead.

CSS should be in an external stylesheet rather than in a style attribute.

Share this post


Link to post
Share on other sites

Hi there @Penny! The <ol> tags use type=""  attribute to define the ordination. This is a very important concept, and a basic one. <ul>s don't work with the attribute type="".

Ordered/Unordered Lists can work with the property list-style-type="" because they are lists whatsoever, but ordered lists must have a type of...ordination item, A, a, i, I or  number.

Unordered List (The order doesn't matter, we don't need indicators of an item's priority.) || Ordered List (The order matters, we need indicators of an item's priority.)
. Hey                                                                                                                                                    a) This is more important to know before all;                                           
. There                                                                                                                                                 b) Ordered lists are often legal or technical documents like @Ingolme pointed;
. Hello                                                                                                                                                  c) That's why we need importance' scale.

Hope I could help! https://www.w3schools.com/html/html_lists.asp 

 

Edited by Ghostdancing

Share this post


Link to post
Share on other sites

The list is already ordered, you would only need to specify the type if the type itself really matters. By default it's numbers and most of the time that's good enough.

Share this post


Link to post
Share on other sites
On 1/10/2020 at 11:14 PM, Ingolme said:

The list is already ordered, you would only need to specify the type if the type itself really matters. By default it's numbers and most of the time that's good enough.

It seems I didn't make myself clear. @Penny asked what are the differences and there are. Ordered lists require...ordination, let's look in the dictionary: The noun ordination comes from the Latin word ordinare, meaning “put in order.” 

Primary Meanings of 
ordination

1.
n
the act of ordaining; the act of conferring (or receiving) holy orders
2.
n
logical or comprehensible arrangement of separate elements

arrangement

an orderly grouping (of things or persons) considered as a unit; the result of arranging
 
A list look ordered because it follows a logical arrangement, in our brains, but we need a logical indicator of importance in code. <ul> can't receive the type="" attribute, because there are no itens that must become first,  <ol> receive type="" attribute. <ol> don't receive list-style-type, because it has to be ordered with A, a, I, i or a number, <ol> must sign wich item has priority. <ul> receive list-style-type because it has no ordered itens, they're just below each other.
Suppose you have to code something that only reads the second itens of lists.
Suppose you have to code something that reads the third itens of a list but only the lists that have the type="A".
Let's code.
Edited by Ghostdancing

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...

×
×
  • Create New...