為你的wordpress添加樣式好看的按鈕

有很多人的網站,需要一個好看的按鈕。
那麼這就是一個很棒的參考,

大型按鈕

按鈕按鈕按鈕按鈕按鈕按鈕按鈕按鈕按鈕按鈕按鈕按鈕

[cc lang="php"]

按鈕 按鈕 按鈕 按鈕 按鈕 按鈕 按鈕 按鈕 按鈕 按鈕 按鈕 按鈕

[/cc]
你可以在#裡面增加網址,也更改按鈕名稱

中型按鈕

按鈕按鈕按鈕按鈕按鈕按鈕按鈕按鈕按鈕按鈕按鈕按鈕

[cc lang="php"]

按鈕 按鈕 按鈕 按鈕 按鈕 按鈕 按鈕 按鈕 按鈕 按鈕 按鈕 按鈕

[/cc]

小按鈕

按鈕按鈕按鈕按鈕按鈕按鈕按鈕按鈕按鈕按鈕按鈕按鈕 [cc lang="php"]

按鈕 按鈕 按鈕 按鈕 按鈕 按鈕 按鈕 按鈕 按鈕 按鈕 按鈕 按鈕 [/cc]

對應的css是
[cc lang="php"] /* =========================== 按鈕 =========================== */ .btn-base { width: 140px !important; height: 49px; line-height: 49px; display: inline-block !important; cursor: pointer; border-radius: 5px; text-align: center; margin: 4px 4px 4px 0; color: #fff !important; font-size: 14px; padding: 0 !important; } button:hover, button, .sidebar-nav *, .btn-base, .btn-base:hover, .small-btn-base:hover, a.btn-primary:hover, button:hover, .form-actions a.btn { transition: all 200ms linear 0s !important; } .btn-base:hover, .small-btn-base:hover { background: none repeat scroll 0 0 #262626 !important; color: #FFFFFF !important; } .btn-hot-pink { background-color: #EE2465; } .btn-pink { background-color: #ec6681; } .btn-purple-low { background-color: #5e5668; } .btn-gray { background-color: #9d9ea6; } .btn-blue-1 { background-color: #278aab; } .btn-blue-2 { background-color: #199dac; } .btn-green { background-color: #4c8624; } .btn-blue-3 { background-color: #7fcdcd; } .btn-orange { background-color: #e15d44; } .btn-red-orange { background-color: #dc4123; } .btn-yellow { background-color: #f9c62d; } .btn-blue-4 { background-color: #09c0be; } div .small-btn-base{ width: 92px !important; text-align: center; height: 29px; line-height: 29px; display: inline-block !important; cursor: pointer; border-radius: 5px; margin: 4px 4px 4px 0; color: #fff !important; } .round-btn { border-radius: 25px !important; width: 137px !important; height: 40px; line-height: 37px; } a.btn-primary:hover, button:hover, .form-actions a.btn:hover { background: none repeat scroll 0 0 #262626 !important; color: #FFFFFF !important; } button:hover, button, .sidebar-nav *, .btn-base, .btn-base:hover, .small-btn-base:hover, a.btn-primary:hover, button:hover, .form-actions a.btn { transition: all 200ms linear 0s !important; } [/cc]

評論 (0)

此處尚未發表評論

留言

  1. 以遊客身份發表評論。 註冊登入到您的帳戶。
附件 (0 / 3)
分享您的位置