CSS:碰觸後寬度緩慢增加
2013/01/01
萌芽站長
500 0
網站技術 , CSS
⚠️ 溫馨提醒:我們發現您可能啟用了廣告阻擋器,請將本站加入白名單以正常閱讀文章內容,謝謝支持 ❤️
這是基本的CSS寫法~歡迎參考!
↓範例(游標移到上面試試)
測試
~完整語法~
一、CSS部分
<style>
.mnya027 {
font:12px Tahoma,'Microsoft Yahei','mingliu';
background:rgba(102, 255, 255, 0.6);
padding: 3px;
border-radius: 5px;
-moz-border-radius: 5px;
height:30px;
width:50px;
-webkit-transition: all 0.5s linear;
-moz-transition: all 0.5s linear;
-o-transition: all 0.5s linear;
transition: all 0.5s linear;
}
.mnya027:hover {
width:200px;
}
</style>
二、HTML部分
<div class="mnya027">測試</div>
贊助廣告 ‧ Sponsor advertisements
Ionicons:精美開源圖標、Material & iOS 風格、可運用在網站上
📆 2019-01-18
📁
網站技術, HTML, CSS, JavaScript
Node.js:Webpack 基礎概念與 JS 封裝過程教學(使用 VS Code)
📆 2019-08-19
📁
軟體應用, 網站技術, JavaScript, Node.js, Webpack
CSS:陰影 box-shadow
📆 2013-01-01
📁
網站技術, CSS
JavaScript:游標碰觸子元素使父元素樣式變更
📆 2019-11-10
📁
網站技術, HTML, CSS, JavaScript
Brackets 擴充功能「Beautify & Indent Guides」:自動縮排美化與縮排層次標記
📆 2018-09-20
📁
軟體應用, 網站技術
【萌芽網站技術教學】第一章:準備當個網站站長
📆 2014-07-27
📁
網站技術
【論壇經營】Discuz! X3.1去除標題中的Powered by Discuz!
📆 2014-01-11
📁
網站技術, 架站程式, Discuz!
【論壇美化】友情連結區域美化
📆 2013-01-01
📁
網站技術, 架站程式, Discuz!
留言區 / Comments
萌芽論壇