How to use CSS list-style-position

list-style-position attribute is used to specify the position of the mark to be displayed at the beginning of the list. There are external and internal specification methods. This article will introduce to you about list-style- in CSS. How to use position, let’s take a look at the specific content below.

What is list-style-position?

It is used to specify the display of the mark (·) in

. (Related recommendations: CSS Learning Manual)

Let us specify the position of the mark in the list by adding the following values.

outside

mark is displayed outside, it becomes indented (indented) display.

inside

The tag is displayed inside the content area of ​​the list, it sets the height of the tag and the part outside the tag.

The mark can be completely removed by executing the following code.

list-style-position: inside;
list-style-type: none;

Let’s look at the specific code

HTML

<ul>
  <li>test</li>
  <li>test</li>
  <li>test</li>
</ul>

CSS

li {
  list-style-position: inside;
  list-style-type: none;
}

Display the effect on the browser As follows: The mark (·) is gone

This article ends here. For more related content, you can pay attention to CSS Video Tutorial# on the php Chinese website. ##further study! ! !

The above is the detailed content of How to use CSS list-style-position. For more information, please follow other related articles on the PHP Chinese website!