logo logo logo   jQuery Mobile - CSS classes




Classes hos jQm jquery

Classes hos W3schools jquery


jQuery Mobile's css-fil kan ses her: x


Globale
ui-corner-allElementet får runde hjørner (radius .3125em)
ui-shadowTilføjer skygge til elementet (0 1px 3px rgba(0,0,0,.15)
ui-overlay-shadowTilføjer 'lagdelingsskygge' til elementet (0 0 12px rgba(0,0,0,.6);)
ui-miniFormindsker størrelsen på elementet.
Widgets
ui-collapsible-insetCollapsible: Indsætter horisontale marginer, kanter og runde hjørner.
ui-listview-insetListview: Indsætter h orisontale marginer, kanter og runde hjørner.
Knapper
ui-btnEtablerer knap ved f.eks. <a... elementer (font-weight: bold;border-width: 1px;border-style: solid;)
ui-btn-inlineViser aktuel knap inline (display: inline-block; vertical-align: middle; margin-right: .625em;)
ui-btn-icon-topPlacerer ikon over tekst på knap (padding-top: 2.5em;)
ui-btn-icon-rightPlacerer ikon til højre for tekst på knap (padding-right: 2.5em;)
ui-btn-icon-bottomPlacerer ikon over tekst på knap (padding-bottom: 2.5em;)
ui-btn-icon-leftPlacerer ikon til venstre for tekst på knap (padding-left: 2.5em;)
ui-btn-icon-notextViser ikon uden tekst (padding: 0; width: 1.75em; height: 1.75em; text-indent: -9999px; white-space: nowrap !important;)
ui-btn-a|bStyrer farven på knap og tekst: ui-btn-a = grå baggrund + sort tekst. ui-btn-b = sort baggrund + hvid tekst.
Farver
ui-bar-(a-z)Tilknytning af farve a-z til bjælker: header, footer etc. (border-width: 1px; border-style: solid;)
ui-btn-(a-z)Tilknytning af farve a-z til knap (og ikon).
ui-group-theme-(a-z)Tilknytning af farve a-z til 'controlgroups', 'listviews' og 'collapsible sets'.
ui-overlay-(a-z)Tilknytning af farve a-z til sider ligger under 'popup' og andre 'overliggende' elementer.
ui-page-theme-(a-z)Tilknytning af farve a-z til 'pages'.
ui-panel-page-container-(a-z)Tilknytning af farve a-z til 'pages'.
Gitre
ui-grid-solo
ui-block-a		1 kolonne på 100%
ui-grid-a
ui-block-a|b		2 kolonner på 50% / 50%
ui-grid-b
ui-block-a|b|c		3 kolonner på 33% / 33% / 33%
ui-grid-c
ui-block-a|b|c|d		4 kolonner på 25% / 25% / 25% / 25%
ui-grid-d
ui-block-a|b|c|d|e		5 kolonner på 20% / 20% / 20% / 20% / 20%
x
x