2012-08-28 2 views
5

jQuery UI 테마와 부트 스트랩 2.1 CSS가 모두 내 페이지에 링크되어 있습니다. 부트 스트랩 스타일 단추를 사용하는 경우 텍스트가 표시되지 않습니다.jQuery UI 및 부트 스트랩 테마 콜리 전

디버그 도구에서 제거

.ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button { font-family: Verdana,Arial,sans-serif; font-size: 1em; }

은 1em은 더 이상 단추 텍스트 캐스트가 보이지 너무 작게 : 그것은이 문제를 일으키는 jQuery를 UI의 테마에 선 이었다는 것을 밝혀졌다. Bootstrap.css가 나중에 스타일 시트 목록에 추가되어 더 많은 가치를 갖도록 만들었지 만, jQuery UI의 defeiniciton은 더 구체적입니다. 내 부트 스트랩 버튼에 영향을 줄 수있는 jQuery UI CSS 데이터를 미리 준비하려면 어떻게해야합니까?

답변

5

버튼, 특히 문제가 있습니다. jQuery UI의 버튼 구현이 부트 스트랩과 충돌합니다. 당신이 자신의 표준 양식을 사용하려는 경우, 당신은 충돌 제거하기 전에 위젯 초기화에, 페이지에 다음 줄을 추가 할 수 있습니다 : 난 단지 단순한 경우이 테스트 한

var btn = $.fn.button.noConflict() // reverts $.fn.button to jqueryui btn 
$.fn.btn = btn // assigns bootstrap button functionality to $.fn.btn 

을, 그러나 나는 그것이 일반적으로 작동한다고 추정한다. 이 접근법은 적절한 참조 링크로 여기에 설명되어 있습니다.

http://www.dullsharpness.com/2013/04/29/resolve-jqueryui-and-twitter-bootstrap-button-conflict/