2013-08-31 2 views
1

На this page есть кнопка «Главная» в заголовке. Я хотел бы сопоставить этот точный стиль с кнопкой Home, которую вы видите внизу страницы. В структуре JQM применяется сочетание классов в кнопке заголовка, но я не могу понять, как применить этот стиль, чтобы нижняя кнопка совпадала.Как совместить стиль JQuery Mobile Header Button в теле?

Например, размер шрифта и сама кнопка больше в нижней кнопке. Я не хочу помещать нижнюю кнопку в нижний колонтитул, потому что уже есть фиксированный нижний колонтитул, и я не хочу привлекать слишком много внимания, должна быть простой кнопкой, чтобы вернуться на домашнюю страницу. Может кто-нибудь помочь с этим? Благодаря!

+0

Они кажутся мне одинаковыми ... Кроме того, что их больше –

+0

Верхняя кнопка получает некоторые стили на основе обертки, в которой она находится. Было бы проще просто применить стили к нижней кнопке, а не обертывать ее в необходимых родительских элементах и ​​добавлении всех этих классов –

+0

Спасибо Джошуа, я попытался это сделать, но кнопка не изменилась вообще. Либо я хватаю неправильные стили из Firebug, либо я применяю их к неправильному элементу. Может ли кто-нибудь отправить решение с кодом? – user2736184

ответ

1

Во-первых, добавить идентификатор на вторую кнопку и добавьте эти стили

#second-button 
{ 
    font-size: 12.5px; 
    padding-left: 30px; 
    padding-right: 11px; 

Для тега привязки окружающих вторую кнопку

#second-button-a 
{ 
    box-shadow: box-shadow: 0 1px 0 rgba(255, 255, 255, 0.3); 
    border-radius: 6px; 
} 

Там вы идете братан. Я использовал firebug для проверки двух элементов и проверки различий. Я бы настоятельно советовал установить firebug (плагин firefox). Это очень полезно для разработки веб-интерфейса для всех, связанных с html, css и javascript. Всего наилучшего.

+1

+1 хороший ответ. Лично я предпочитаю включать [Page Inspector] (https://developer.mozilla.org/en-US/docs/Tools/Page_Inspector), и это намного проще в использовании, чем Firebug. Привет, – Stano

+1

Не пробовал @Stano. Firebug удовлетворяет всем моим потребностям. Но вы никогда не знаете преимуществ чего-то еще, пока не столкнетесь с этим. Обязательно проверьте это, спасибо. –

+0

@ Joshua: Спасибо за код. Вы читаете эти стили прямо из Firebug? Думаю, мне нужно приблизиться к скорости - неясно, куда идти в интерфейсе Firebug, чтобы точно знать, какие стили используются. – user2736184

Смежные вопросы