[html] 기본 목록 스타일 (CSS)이란 무엇입니까?

내 웹 사이트에서 reset.css를 사용합니다. 목록 스타일에 정확히 다음을 추가합니다.

ol, ul {
    list-style: none outside none;
}
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
    background: none repeat scroll 0 0 transparent;
    border: 0 none;
    font-size: 100%;
    margin: 0;
    outline: 0 none;
    padding: 0;
    vertical-align: baseline;
}

문제는 모든 목록 스타일이 이것으로 설정된다는 것 NONE입니다. 웹 사이트 하위 페이지의 모든 목록 (의 모든 목록)에 대해서만 원래 목록 스타일 (기본값)을 되돌리고 싶습니다 .my_container.

내가 좋아하는 설정 것을 시도하는 경우 list-style-typeinherit그냥이 CSS 속성에 대한 브라우저의 기본 스타일을 상속하지 않습니다이다.

reset.css를 수정하지 않고 특정 속성에 대한 원래 브라우저의 스타일을 상속하는 방법이 있습니까?



답변

이 CSS를 설정하여 재설정을 제거했습니다.

ul {
   list-style-type: disc;
   list-style-position: inside;
}
ol {
   list-style-type: decimal;
   list-style-position: inside;
}
ul ul, ol ul {
   list-style-type: circle;
   list-style-position: inside;
   margin-left: 15px;
}
ol ol, ul ol {
   list-style-type: lower-latin;
   list-style-position: inside;
   margin-left: 15px;
}

편집 : 물론 특정 클래스로 …


답변

나는 이것이 실제로 당신이 찾고있는 것이라고 생각합니다.

.my_container ul
{
    list-style: initial;
    margin: initial;
    padding: 0 0 0 40px;
}

.my_container li
{
    display: list-item;
}


답변

문서에 따라 대부분의 브라우저는 다음 기본값으로 <ul>, <ol><li>요소를 표시 합니다.

UL 또는 OL 태그에 대한 기본 CSS 설정 :

ul, ol {
    display: block;
    list-style: disc outside none;
    margin: 1em 0;
    padding: 0 0 0 40px;
}
ol {
    list-style-type: decimal;
}

LI 태그에 대한 기본 CSS 설정 :

li {
    display: list-item;
}

중첩 된 목록 항목도 스타일 지정 :

ul ul, ol ul {
    list-style-type: circle;
    margin-left: 15px;
}
ol ol, ul ol {
    list-style-type: lower-latin;
    margin-left: 15px;
}

참고 : 클래스에 위의 스타일을 사용하면 결과가 완벽 할 것입니다. 다른 목록 항목 마커 도 참조하십시오 .


답변

http://www.w3schools.com/tags/tag_ul.asp

ul {
    display: block;
    list-style-type: disc;
    margin-top: 1em;
    margin-bottom: 1em;
    margin-left: 0;
    margin-right: 0;
    padding-left: 40px;
}


답변

당신은 할 수 없습니다. 요소에 속성을 할당하는 스타일 시트가 적용될 때마다 해당 요소의 인스턴스에 대해 브라우저 기본값으로 이동할 수있는 방법이 없습니다.

reset.css의 (논란의 여지가있는) 아이디어는 브라우저 기본값을 제거하여 깨끗한 책상에서 자신 만의 스타일을 시작할 수 있도록하는 것입니다. reset.css의 어떤 버전도이 작업을 완전히 수행하지 않지만, 그들이 수행하는 범위 내에서 reset.css를 사용하는 작성자 는 렌더링 을 완전히 정의 해야합니다 .


답변

두 번째 CSS 블록의 모든 요소에서 여백을 재설정합니다. 기본 여백은 40px입니다. 이렇게하면 문제가 해결됩니다.

.my_container ul {list-style:disc outside none; margin-left:40px;}


답변

미래에 대한 대답 : CSS 4에는 revert 키워드가 포함될 것입니다.이 키워드는 속성을 사용자 또는 사용자 에이전트 스타일 시트 [ source ] 의 값으로 되돌 립니다. 이 글을 쓰는 시점에서 Safari만이이를 지원합니다. 여기 에서 브라우저 지원 업데이트를 확인하세요 .

귀하의 경우에는 다음을 사용합니다.

.my_container ol, .my_container ul {
    list-style: revert;
}

자세한 내용은 이 다른 답변 을 참조하십시오.