Czy można zastąpić już stylizowane elementy JQuery Mobile (przyciski, listy itp.) Osobnym niestandardowym plikiem css?Zastępowanie Jquery Mobile CSS
Jeśli tak, to w jaki sposób mogę odwoływać się do elementów.
Dzięki
nie wiem urzędnika, elegancki sposób to zrobić, ale patrzę w non-minutowym pliku css na znalezienie zajęcia, a następnie dodać takie rzeczy do pliku .css zawarte po z jquery mobile jeden:
.ui-header .ui-title {margin-right: 20px; margin-left: 20px;}
.ui-footer .ui-title {margin-right: 20px; margin -left: 20px; white-space: normal;}
Również firebug i dev. narzędzia (chrome) są twoim przyjacielem - sprawdź elementy i ich style.
Libby
Tak można przesłonić wszystkie style css już zdefiniowanych w telefonie jQuery, ale spójrz na jak zrobić to w dobry sposób. Theming overview w dokumentacji jQuery zawiera informacje odnoszące się do Twojego pytania. W szczególności:
nadrzędnych tematów
Tematy są pomyślane jako stałego punktu wyjścia, ale mają być dostosowane do dodać elementy na zamówienie, które sprawiają, witryny lub aplikację unikalny. Ponieważ wszystko jest kontrolowane przez CSS, można łatwo użyć narzędzia do inspekcji sieci WWW, aby zidentyfikować właściwości stylu, które chcesz zmodyfikować. Zbiór klas tematycznych (globalnych) i semantycznych strukturalnych klas (specyficznych dla widgetów) dodanych do elementów zapewnia bogaty zestaw możliwych selektorów do nadpisań stylu docelowego. Zalecamy dodanie zewnętrznego arkusza stylów do nagłówka, umieszczonego po strukturze i odwołania do arkusza stylów kompozycji, które zawierają wszystkie style nadpisane w stylu. Umożliwia to łatwą aktualizację do nowszych wersji biblioteki , ponieważ przesłonięcia są przechowywane oddzielnie od kodu biblioteki.
+1 za opublikowanie dokumentacji w celu nadpisania motywów. – botbot
Istnieje ogromne nieporozumienie na temat korzystania z własnych stylów z JQM że znalazłem wszędzie, w tym SO. Sztuczka polegająca na używaniu własnego CSS z JQM polega na pisaniu własnego CSS. Zasadniczo musisz najpierw określić element, który chcesz zastąpić CSS JQM za pomocą id, a następnie dołączyć klasę JQM do tego identyfikatora. Na przykład, aby usunąć standardowy kod CSS ramki połączenia JQM z łącza obrazu, gdzie # img_button_1 jest identyfikatorem nadanym rodzicowi-rodzicowi, kodowanie CSS wygląda tak ...
Kod HTML ...
<a id="img_button_1" data-role="button" data-theme="none" data-corners="false" data-shadow="false" data-inline="true"
href="http://www.google.com" target="_blank">
<img src="http://www.google.com/images/srpr/logo1w.png" alt="Google" />
</a>
Twoje przesłonięcie CSS ...
#img_button_1 .ui-btn-inner { border: 0 }
Odpowiedziałem to wcześniej kilka przykładów roboczych, które można znaleźć tutaj
Jquery Mobile - Using image as link - Blue line below image
można użyć tej samej techniki rozwiązywania wszystkich konfliktów JQM CSS. Teraz możesz ponownie rozważyć użycie JQM, aby osiągnąć pożądane rezultaty, wiedząc, jak łatwo jest rozwiązać te konflikty, używając CSS w swoim CSS. Mam nadzieję że to pomoże!
To było dla mnie proste rozwiązanie, dzięki. – robnick
Próbowałem używać podejścia klasowego, ale mimo że moje css zostało załadowane po jquery mobile css, zostało przesłonięte. Użycie id to naprawiło. Dzięki. –
Należy sprawdzić informacje o wersji dla każdej nowej wersji.
Istnieje wiele przydatnych informacji na temat zmian w hierarchii css. Oczywiście z każdą wersją staje się ona bardziej stabilna, ale prawdopodobnie będzie coś, co musisz wiedzieć.
1,4 CSS uaktualnienie doc: http://jquerymobile.com/upgrade-guide/1.4/#override-with-custom-css
Bardzo przydatne dla ludzi, aby wiedzieć. Widzę, że jest to fantastyczne narzędzie do dostosowywania interfejsu użytkownika. – jcrowson
ThemeRoller został przeniesiony do: - http://themeroller.jquerymobile.com/ –