Na swojej stronie używam reset.css. Dodaje dokładnie to do listy stylów:
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;
}
Problem polega na tym, że wszystkie style list są ustawione na NONE
to. Chcę przywrócić oryginalne style list (domyślne) dla wszystkich list tylko na podstronach witryny (wszystkie listy w .my_container
).
Przy próbie ustawienia rzeczy, jak list-style-type
na inherit
to nie dziedziczy style domyślne w przeglądarce tylko dla tej właściwości CSS.
Czy istnieje sposób na odziedziczenie oryginalnych stylów przeglądarki dla niektórych właściwości bez modyfikowania reset.css?
html
css
html-lists
Atadj
źródło
źródło
Odpowiedzi:
Kiedyś ustawiłem ten CSS, aby usunąć reset:
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; }
EDYCJA: oczywiście z określoną klasą ...
źródło
Myślę, że właśnie tego szukasz:
.my_container ul { list-style: initial; margin: initial; padding: 0 0 0 40px; } .my_container li { display: list-item; }
źródło
inherit
dziedziczy style z kontenerów nadrzędnych i nie ustawia ich na domyślne wartości przeglądarki.initial
czy to (dowiedziałem się o jego istnieniu później), ale czy jesteś tego pewienul { list-style: initial; }
iol { list-style: initial; }
przyniesie ważny wynik? Czy nie jest ustawionylist-style
na wartość początkową, niezależnie od elementu, do którego jest stosowany? Czyinitial
wartość nie będziedisc outside none
dotyczyła obu typów list?initial
nigdy nie przyszło mi do głowy!initial
nie jest obsługiwane w żadnej wersji IE msdn.microsoft.com/en-us/library/…Zgodnie z dokumentacją większość przeglądarek wyświetli elementy
<ul>
,<ol>
i<li>
z następującymi wartościami domyślnymi:Domyślne ustawienia CSS dla tagu UL lub OL :
ul, ol { display: block; list-style: disc outside none; margin: 1em 0; padding: 0 0 0 40px; } ol { list-style-type: decimal; }
Domyślne ustawienia CSS dla tagu LI :
li { display: list-item; }
Stylizuj również zagnieżdżone elementy listy:
ul ul, ol ul { list-style-type: circle; margin-left: 15px; } ol ol, ul ol { list-style-type: lower-latin; margin-left: 15px; }
Uwaga: Wynik będzie doskonały, jeśli użyjemy powyższych stylów z klasą. Zobacz także różne znaczniki pozycji listy .
źródło
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; }
źródło
Nie możesz. Za każdym razem, gdy stosowany jest arkusz stylów, który przypisuje właściwość do elementu, nie ma sposobu, aby przejść do ustawień domyślnych przeglądarki dla dowolnego wystąpienia elementu.
(Dyskusyjną) ideą reset.css jest pozbycie się domyślnych ustawień przeglądarki, abyś mógł rozpocząć własną stylizację z czystego biurka. Żadna wersja reset.css nie robi tego całkowicie, ale w takim zakresie, w jakim robią, autor używający reset.css powinien całkowicie zdefiniować renderowanie.
źródło
Resetujesz margines na wszystkich elementach w drugim bloku css. Domyślny margines to 40 pikseli - to powinno rozwiązać problem:
.my_container ul {list-style:disc outside none; margin-left:40px;}
źródło
Odpowiedź na przyszłość: CSS 4 prawdopodobnie będzie zawierał słowo kluczowe revert, które przywraca właściwość do jej wartości z arkusza stylów użytkownika lub klienta użytkownika [ źródło ]. W chwili pisania tego tekstu obsługuje to tylko Safari - sprawdź tutaj aktualizacje dotyczące obsługi przeglądarek.
W twoim przypadku użyłbyś:
.my_container ol, .my_container ul { list-style: revert; }
Zobacz także tę inną odpowiedź z kilkoma szczegółami.
źródło