[問題] 如何更改jQuery UI的CSS樣式呢?

作者: iceleaf (我行我素 我型我塑)   2016-08-24 19:14:40
jQuery新手提問,
我想要更改這個例子的CSS樣式,
http://www.runoob.com/try/try.php?filename=jqueryui-example-progressbar
請問如何更改:
1.進度條總寬度
2.進度條總高度
3.進度條外框顏色
4.進度條內bar的顏色
5.進度條內背景顏色
6.外框圓角大小
看前面的說明有點花,不知道如何更改......
請版上指導我方向,感激不盡.....
作者: ymcheung (ymc)   2016-08-24 19:42:00
他的樣式都放在 jquery-ui.min.css通常會附上沒有 .min.css 的原始檔案 比較容易改
作者: iceleaf (我行我素 我型我塑)   2016-08-24 21:55:00
感謝回應 但我還是不清楚該怎麼做 我目前只會用純CSS設定各個div樣式...
作者: swallowcc (guest)   2016-08-24 23:22:00
用chrome開發者工具找出樣式定義的地方再override掉
作者: iceleaf (我行我素 我型我塑)   2016-08-24 23:45:00
有在chrome開發者工具Element看到樣式了,那我的下一步該怎麼做呢? 不好意思....
作者: ymcheung (ymc)   2016-08-25 03:49:00
開發者工具無法儲存 只看暫時看(有錯請指正)所以根本的還是要用 jquery-ui.css 的檔案
作者: ssccg (23)   2016-08-25 10:22:00
通常不會直接改library的css吧,自己寫個css檔把要override的樣式寫在裡面就好
作者: devil115789 (味噌湯好喝)   2016-08-25 10:56:00
1.width 2.height 3.border-color 4.5.圖 6.radius基本上就是自己寫一個css蓋過去就可以了改library也可以 只是建議換個檔名 以免搞混
作者: iceleaf (我行我素 我型我塑)   2016-08-25 11:39:00
目前根據樓上各位大大解釋後,找到的解決方法是:用開發者工具找到CSS樣式,複製下來後,貼到html內做CSS調整,請問這樣是正確的做法嗎? 看起來是有改樣式,但不曉得這樣是不是理想的做法
作者: sycc (100倍返しだ!)   2016-08-25 12:25:00
這樣也可以。更好的作法是把樣式貼到一個新開的css檔裡
作者: CauseSam (天翼)   2016-08-25 13:22:00
你在抓jquery ui時其實可以選擇自訂樣式
作者: iceleaf (我行我素 我型我塑)   2016-08-25 13:38:00
新開css真的畫面比較乾淨~ 還有請問樓上有教學範例嗎?我可能需要範例才能入門......感謝
作者: swallowcc (guest)   2016-08-25 14:41:00
http://jqueryui.com/themeroller/ 不用啥範例吧...點一點選一選下載 import 進去就可以用了啊
作者: iceleaf (我行我素 我型我塑)   2016-08-26 00:16:00
樓上..其實我不曉得該怎麼做....(汗)....
作者: swallowcc (guest)   2016-08-26 21:55:00
誒,你有點著玩左邊的選單試試嗎? 點成你喜歡的樣式然後下載,解壓縮, 把檔案放進你的project...再把你的 html 內的 reference 改成對應檔名就好

Links booklink

Contact Us: admin [ a t ] ucptt.com