목록 항목 사이의 세로 간격을 어떻게 설정합니까?

목록 항목 사이의 세로 간격을 어떻게 설정합니까?

---

<ul>요소 내에서 행 사이의 수직 간격은 분명히 line-height 속성으로 형식을 지정할 수 있습니다.

내 질문은 <ul>요소 내 에서 목록 항목 사이의 세로 간격을 어떻게 설정합니까?

---

여백을 사용할 수 있습니다. 예를 참조하십시오.

http://jsfiddle.net/LthgY/

li{
  margin: 10px 0;
}

---

HTML

<ul>
   <li>A</li>
   <li>B</li>
   <li>C</li>
   <li>D</li>
   <li>E</li>
</ul>

CSS

li:not(:last-child) {
    margin-bottom: 5px;
}

편집 : 마지막 li 요소에 대해 특별한 경우를 사용하지 않으면 나중에 목록에 작은 간격이 생깁니다. http://jsfiddle.net/wQYw7/

이제 내 솔루션과 비교하십시오 : http://jsfiddle.net/wQYw7/1/

확실히 이것은 이전 브라우저에서 작동하지 않지만 이전 브라우저에서 이것을 활성화하는 js 확장을 쉽게 사용할 수 있습니다.

---

나는 IE8 지원의 미덕을 가진 이것에 기울일 것입니다.

li{
    margin-top: 10px;
    border:1px solid grey;
}

li:first-child {
    margin-top:0;
}

JSFiddle

---

태그에 margin를 추가 하십시오 li. 그러면 사이에 공백 이 생기고 태그 내의 텍스트 간격을 설정하는 데 li사용할 수 있습니다 .line-heightli

---

HTML 이메일 블래스트를 생성 할 때 스타일 시트 나 스타일 / 스타일 블록을 사용할 수없는 경우가 많습니다. 모든 CSS는 인라인이어야합니다. 글 머리 기호 사이의 간격을 조정하려면 li style = "margin-bottom : 8px;"를 사용합니다. 각 글 머리 기호 항목에서. 원하는대로 픽셀 값을 사용자 지정합니다.

---

의사 클래스를 사용하여 각 목록에 대해 padding-bottom을 설정하는 것은 실행 가능한 방법입니다. 또한 줄 높이를 사용할 수 있습니다. font-family, Font-weight 등과 같은 글꼴 속성은 높이가 고르지 않은 경우 역할을합니다.

---

<br><li></li>줄 항목 사이에 내가 시도한 모든 웹 브라우저에서 완벽하게 작동하는 것처럼 보이지만 온라인 W3C CSS3 검사기를 통과하지 못했습니다. 내가 추구하는 줄 간격을 정확하게 제공합니다. 내가 우려하는 한, 의심 할 여지없이 작동하기 때문에 누군가가 좋은 법적 대안을 찾을 수있을 때까지 W3C가 말한대로 계속 사용하고 있습니다.

참고 URL : https://stackoverflow.com/questions/19254411/how-do-i-set-vertical-space-between-list-items