수평 정렬되지 않은 목록() 내부에 목록 항목()을 수직으로 가운데에 맞추는 방법은 무엇입니까?

수직 정렬

• 의 수직 정렬 내의 요소 수평
  미학과 유용성을 위해 필요한 경우가 많습니다. 해결책은 다음과 같습니다.

  CSS를 사용하여

  • 높이와 동일한 요소는 아래와 같습니다.

    <code class="css">li {
        height: 30px;
        line-height: 30px;
    }</code>

    제공된 코드에서:

    • 각
    • 높이는 100px입니다.
    • 버튼의 높이는 50px로 다릅니다(.button 클래스에 의해 제공됨).

    콘텐츠를 세로로 가운데에 배치하려면 다음 줄 높이를 추가해야 합니다. 스타일시트에 값을 추가합니다.

    <code class="css">.toolbar li {
        line-height: 100px; /* For regular list items */
    }
    .toolbar li.button {
        line-height: 50px; /* For button list items */
    }</code>

    이렇게 하면 모든 목록 항목과 해당 내용이 수직으로 중앙에 배치됩니다.

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