這是基本的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>

Flickity：超強大的 jQuery 插件！建立全平台都支援的幻燈片或卡片！
📆 2019-01-19
📁 網站技術, HTML, CSS, JavaScript, jQuery

CSS:陰影 box-shadow
📆 2013-01-01
📁 網站技術, CSS

Node.js：建構路徑物件、自動監看執行、批次檔小技巧（Gulp、mozjpeg 批次圖片壓縮 - 延伸篇�...
📆 2019-03-31
📁 多媒體, 網站技術, JavaScript, Node.js, 靜圖處理, Gulp

【論壇美化】全局框線美化
📆 2013-01-01
📁 網站技術, 架站程式, Discuz!

Beautify（Visual Studio Code 擴充功能）：美化網頁原始碼、支援 javascript、CSS 和 HTML 等
📆 2019-02-11
📁 軟體應用, 網站技術

HTML <datalist> 輸入欄位可自動補字之下拉選單
📆 2021-10-08
📁 網站技術, HTML

Node.js：Gulp 運行 imagemin-mozjpeg，mozjpeg 批次圖片壓縮
📆 2019-03-26
📁 多媒體, 網站技術, JavaScript, Node.js, 靜圖處理, Gulp

SQL 語法建立資料庫、資料表及其欄位、資料練習
📆 2019-02-28
📁 網站技術, 程式設計, 資料庫, SQL