CSS 목록 스타일 위치를 사용하는 방법

list-style-position 속성은 목록의 시작 부분에 표시할 마크의 위치를 ​​지정하는 데 사용됩니다. 외부 지정 방법과 내부 지정 방법이 있습니다. 이 글에서는 list-style- 사용 방법을 소개합니다. 아래에서 구체적인 내용을 살펴보겠습니다.

목록 스타일 위치란 무엇인가요?

에 표시(·) 표시를 지정하는 데 사용됩니다. (관련 추천: CSS 학습 매뉴얼)

다음 값을 추가하여 목록에서 마커의 위치를 ​​지정해 보겠습니다.

outside

표시가 바깥쪽에 표시되어 들여쓰기(들여쓰기) 표시가 됩니다.

inside

마크는 목록의 콘텐츠 영역 내부에 표시되며, 마크의 높이와 마크 바깥 부분의 높이를 설정합니다.

다음 코드를 실행하면 해당 마크를 완전히 제거할 수 있습니다.

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

특정 코드를 살펴보겠습니다

HTML

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

CSS

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

브라우저에서 표시되는 효과는 다음과 같습니다. 표시(·)가 사라졌습니다

이 글은 여기서 끝납니다 , 더 많은 관련 콘텐츠를 보려면 PHP 중국어 웹사이트의 CSS 비디오 튜토리얼을 참조하여 더 자세히 알아보세요! ! !

위 내용은 CSS 목록 스타일 위치를 사용하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!