CSS List

Summary

• Control list style

List

• list-style-position: Cho phép ta move bullet point vào trong hay ngoài list-item contents.
• list-style-image: Thay bullet point thành images
• list-style-type: Thay bullet point thành keyword, custom string, icon, …

List style short hand:

list-style: <'list-style-type'> || <'list-style-position'> || <'list-style-image'>
 
 
/* type */
list-style: square;
 
/* image */
list-style: url('../img/shape.png');
 
/* position */
list-style: inside;
 
/* type | position */
list-style: georgian inside;
 
/* type | image | position */
list-style: lower-roman url('../img/shape.png') outside;
 
/* Keyword value */
list-style: none;
 
/* Global values */
list-style: inherit;
list-style: initial;
list-style: revert;
list-style: unset;

• Marker

::marker {
    unicode-bidi: isolate;
    font-variant-numeric: tabular-nums;
    text-transform: none;
    text-indent: 0px !important;
    text-align: start !important;
    text-align-last: start !important;
}