ol reversed attribute
The reversed attribute on the ol element:
- allows you to set the descending order of the items, inside an ordered list
- reversed is a specific attribute → can be applied ONLY on the next HTML5 element: ol
Examples
| <ol | attribute | = | "value(s)" | > | ... | <⁄ol> | example |
|---|---|---|---|---|---|---|---|
| 1. | reversed | = | "", , reversed | < reversed> ... <⁄> < reversed=""> ... <⁄> < reversed="reversed"> ... <⁄> |
Video demonstration ol reversed attribute
HTML5 ol reversed attribute Tutorial
| min | video details |
|---|---|
| 00:08 | video tutorial: reversed attribute applied on ol element objective: understanding reversed attribute and its values |
| 00:18 | in the next ordered list, player A is on 1st position player B is on 2nd position player C is on 3rd position |
| 00:28 | let's say the last results bring: - player C on 1st position & - player A on 3rd position |
| 00:37 | we can manually change players place to reflect the new results |
| 00:46 | the ranked list is valid: - player A on 3rd position & - player C on 1st position |
| 00:58 | or we can use reversed attribute to reverse the ordinal value of the items: ascending → descending |
| 01:06 | the ordinal value of the items has not been reversed → reversed attribute is not supported in Mozilla Firefox v17.0.1 |
| 01:10 | test in Google Chrome |
| 01:15 | note the descending order of the items given by the reversed attribute → a descending list |
| 01:29 | The VALUES of the reversed attribute |
| 01:30 | 1. no value - the presence of the reversed attribute on ol element → a descending list - the absence of the reversed attribute on ol element → a ascending list |
| 01:37 | 2. "" (empty string) → a descending list |
| 01:50 | 3. reversed (attribute's canonical name) → a descending list |
| 02:04 | when reversed attribute is present on an ol: the ascending ol becomes a descending ol |