[html] 글 머리 기호없이 순서가없는 목록이 필요합니다
정렬되지 않은 목록을 만들었습니다. 정렬되지 않은 목록의 글 머리 기호가 번거롭기 때문에 제거하고 싶습니다.
글 머리 기호없이 목록을 만들 수 있습니까?
답변
부모 요소 (일반적으로 a ) 의 CSS 에서 list-style-type를 설정하여 글 머리 기호를 제거 할 수 있습니다 . 예를 들면 다음과 같습니다.none<ul>
ul {
list-style-type: none;
}들여 쓰기도 제거 하려면 추가 padding: 0하고 싶을 수도 있습니다 margin: 0.
목록 서식 기술에 대한 자세한 내용은 Listutorial 을 참조하십시오 .
답변
부트 스트랩을 사용하는 경우 “스타일이없는”클래스가 있습니다.
목록 항목에서 기본 목록 스타일과 왼쪽 여백을 제거하십시오 (즉시 하위 만 해당).
부트 스트랩 2 :
<ul class="unstyled">
<li>...</li>
</ul>http://twitter.github.io/bootstrap/base-css.html#typography
부트 스트랩 3과 4 :
<ul class="list-unstyled">
<li>...</li>
</ul>부트 스트랩 3 : http://getbootstrap.com/css/#type-lists
부트 스트랩 4 : https://getbootstrap.com/docs/4.3/content/typography/#unstyled
답변
당신은 사용해야합니다 list-style: none;
<ul style="list-style: none;">
<li>...</li>
</ul>답변
이전 답변에 대한 미세 조정 : 긴 화면이 추가 화면 행으로 넘겨 질 경우 가독성을 높이려면 :
ul, li {list-style-type: none;}
li {padding-left: 2em; text-indent: -2em;}답변
당신이이에서 작동하도록 할 수 없다면 <ul>수준, 당신은을 배치해야 list-style-type: none;상기 <li>수준 :
<ul>
<li style="list-style-type: none;">Item 1</li>
<li style="list-style-type: none;">Item 2</li>
</ul>이 반복을 피하기 위해 CSS 클래스를 만들 수 있습니다.
<style>
ul.no-bullets li
{
list-style-type: none;
}
</style>
<ul class="no-bullets">
<li>Item 1</li>
<li>Item 2</li>
</ul>필요한 경우 다음을 사용하십시오 !important.
<style>
ul.no-bullets li
{
list-style-type: none !important;
}
</style>답변
나는 총알을 제거하기 위해 ul과 li 모두에 list-style을 사용했습니다. 글 머리 기호를 사용자 정의 문자 (이 경우 ‘대시’)로 바꾸고 싶었습니다. 텍스트가 줄 바꿈 될 때 잘 들여 쓰기 효과를줍니다.
ul.dashed-list {
list-style: none outside none;
}
ul.dashed-list li:before {
content: "\2014";
float: left;
margin: 0 0 0 -27px;
padding: 0;
}
ul.dashed-list li {
list-style-type: none;
}<ul class="dashed-list">
<li>text</li>
<li>text</li>
</ul>답변
ul기본 스타일 을 완전히 제거하려면
list-style-type: none;
margin: 0;
margin-block-start: 0;
margin-block-end: 0;
margin-inline-start: 0;
margin-inline-end: 0;
padding-inline-start: 0;