как настроить вкладки пользовательского интерфейса jquery темы (без использования themeroller)

Question

Я знаю, что вы можете использовать themeroller для настройки темы пользовательского интерфейса, но можно ли сделать это вручную.если да, то есть ли какой-то конкретный CSS, которому вы должны следовать.Спасибо

Answer 1

да, они есть в CSS-файле jquery-ui

:http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.1/themes/ui-lightness/jquery-ui.css

>     /* Tabs ----------------------------------*/
>     .ui-tabs { padding: .2em; zoom: 1; }
>     .ui-tabs .ui-tabs-nav { list-style: none; position: relative;
> padding: .2em .2em 0; }
>     .ui-tabs .ui-tabs-nav li { position: relative; float: left;
> border-bottom-width: 0 !important;
> margin: 0 .2em -1px 0; padding: 0; }
>     .ui-tabs .ui-tabs-nav li a { float: left; text-decoration: none;
> padding: .5em 1em; }
>     .ui-tabs .ui-tabs-nav li.ui-tabs-selected { padding-bottom:
> 1px; border-bottom-width: 0; }
>     .ui-tabs .ui-tabs-nav li.ui-tabs-selected a, .ui-tabs
> .ui-tabs-nav li.ui-state-disabled a,
> .ui-tabs .ui-tabs-nav
> li.ui-state-processing a { cursor:
> text; }
>     .ui-tabs .ui-tabs-nav li a, .ui-tabs.ui-tabs-collapsible
> .ui-tabs-nav li.ui-tabs-selected a {
> cursor: pointer; } /* first selector
> in group seems obsolete, but required
> to overcome bug in Opera applying
> cursor: text overall if defined
> elsewhere... */
>     .ui-tabs .ui-tabs-panel { padding: 1em 1.4em; display: block;
> border-width: 0; background: none; }
>     .ui-tabs .ui-tabs-hide { display: none !important; }

Тем не менее, требуется.никто;} от http://jqueryui.com/demos/tabs/

Answer 2

Я искал тот же ответ, когда наткнулся на сайт Кита Вуда:http://keith-wood.name/uiTabs.html#tabs-min

Вы обнаружите, что он задокументировал несколько вариантов, но Минималистичные вкладки это было хорошее место для меня, чтобы начать.

Answer 3

Конечно, это возможно (поскольку в конечном итоге тема — это просто CSS, изображения и, возможно, Javascript), но это не очень практично.Вы можете взять существующую тему и изменить ее.Дело в том, что вам нужно изменить множество файлов изображений и тому подобного.Кроме того, многие из этих файлов имеют имя, соответствующее цвету или другой соответствующей переменной.

На самом деле это очень разумно, поскольку означает, что вы можете поместить заголовок Expires далекого будущего в CSS и изображения, и если вы измените тему, она все равно будет обновляться правильно.

Таким образом, вы могли бы оставить имена файлов прежними, но тогда у вас возникла бы проблема, если бы вы использовали заголовок Expires для дальнего будущего (что вам и нужно), плюс это могло бы сбить с толку кого-то, кто пришел и увидел его.Или вам придется обновить все эти файлы и все ссылки.

Themeroller намного проще.