CSS:模糊效果的美化邊框
2013/01/01
萌芽站長
3,046 0
網站技術 , CSS
⚠️ 溫馨提醒:我們發現您可能啟用了廣告阻擋器,請將本站加入白名單以正常閱讀文章內容,謝謝支持 ❤️
模糊效果的美化邊框你一定要擁有!
↓範例(游標移到上面試試)
~完整語法~
一、CSS部分
<style>
.mnyappt26 {
border-color: rgba(255, 255, 255, 0.1); /*邊框顏色*/
}
.mnyappt26:hover {
/*box shadow 數值:右距離(px) / 上距離(px) / 模糊(px)
-moz-box-shadow: 0px 0px 5px #99FF99; /*Firefox 的 陰影*/
-webkit-box-shadow: 0px 0px 5px #99FF99; /*webkit 系列瀏覽器的陰影*/
box-shadow: 0px 0px 5px #99FF99; /*IE9 或opera*/
-moz-transition:all 0.5s;
-webkit-transition:all 0.5s;
-o-transition:all 0.5s;
transition:all 0.5s;
}
</style>
二、HTML部分
<input class="mnyappt26" size=15 name="keyword" type="text" placeholder="請輸入搜尋內容" autocomplete="off" x-webkit-speech="" speech="" type="text">
贊助廣告 ‧ Sponsor advertisements
Master Styles Language Service(Visual Studio Code 擴充功能):Master 框架的語法突顯及完成提示
📆 2022-05-02
📁
軟體應用, 網站技術, HTML, CSS
CSS unicode-range 描述自定義字體中使用的字元範圍(Unicode 區段)
📆 2020-04-09
📁
網站技術, CSS
使用 Docker 安裝及運行 Node-RED 教學
📆 2021-12-08
📁
網站技術, 物聯網, Node.js, Node-RED
WordPress 被安裝神秘的外掛,接著訪客隨機被導引至詐騙廣告
📆 2021-06-07
📁
網站技術, 資訊安全, 架站程式, WordPress
Chrome 開發人員工具:關閉快取以偵錯
📆 2019-04-01
📁
軟體應用, 瀏覽器, 網站技術, Google Chrome
【網站經營】WordPress 4.0 限制上傳圖片大小
📆 2015-02-25
📁
網站技術, 架站程式, WordPress
CSS:新版捲(卷)軸!快來看唷!
📆 2013-01-01
📁
網站技術, CSS
Elveshost 精靈主機:購買「增強型虛擬主機」快速建置 WordPress 部落格!
📆 2023-08-27
📁
網站技術, 伺服器, 架站程式, 架站資源, WordPress
留言區 / Comments
萌芽論壇