목록 항목 정렬에 영향을 주지 않고 정렬되지 않은 목록을 가로로 가운데에 맞추는 방법은 무엇입니까?

순서가 지정되지 않은 목록에 대한 텍스트 정렬 사용자 정의 달성

배경:
목록을 수직 및/또는 수평으로 정렬하는 것은 일반적인 요구 사항입니다. 세로 정렬을 제어하는 ​​것은 상대적으로 간단하지만 개별 목록 항목 정렬에 영향을 주지 않고 순서가 지정되지 않은 목록을 가로로 정렬하는 것은 다소 까다로울 수 있습니다.

과제:
이 경우 목표는 목록 항목(

)의 왼쪽 정렬을 유지하면서 너비를 알 수 없는 순서가 지정되지 않은 목록(

)을 가운데에 배치하는 것입니다. 이는 쉬운 솔루션을 제공하는 상위 div 래퍼 사용을 제외합니다.

해결책:
'display' 속성을 활용하여 'table' 값을 사용할 수 있습니다. 순서가 없는 목록(

). 그러면 목록이 표로 설정되고 해당 요소가 표와 같은 방식으로 정렬됩니다. 여백을 0 자동으로 설정하면 상위 컨테이너 내에서 테이블(및 목록)을 중앙에 배치할 수 있습니다.

코드 구현:

<code class="css">ul {
  display: table;
  margin: 0 auto;
}</code>

이 수정 개별 목록 항목의 왼쪽 정렬을 유지하면서 순서가 지정되지 않은 목록을 가로 중앙에 배치할 수 있습니다.

위 내용은 목록 항목 정렬에 영향을 주지 않고 정렬되지 않은 목록을 가로로 가운데에 맞추는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!