iT邦幫忙

第 11 屆 iThome 鐵人賽

DAY 22
2
Software Development

精通 Visual Studio Code系列 第 22

DAY 22 CSS 神器 - Emmet

  • 分享至 

  • xImage
  •  

DAY 22 CSS 神器 - Emmet

Emmet 除了能用在 HTML 之外,在 CSS 也很好用,你只需要打幾個字首,然後一樣按下 Enter 它就能幫你打出來。由於 Emmet 提供的東西也很多,所以我大概列出幾個我常用的 Snippet 就好。

視覺排版類

關鍵字 CSS
pos position:relative;
t top:;
r right:;
b bottom:;
l left:;
d display:block;
d:n display:none;

Margin & Padding

關鍵字 CSS
m margin:;
mt margin-top:;
mr margin-right:;
mb margin-bottom:;
ml margin-left:;
p padding:;
pt padding-top:;
pr padding-right:;
pb padding-bottom:;
pl padding-left:;

other

關鍵字 CSS
! !important
@m, @media @media screen {}

更多可用的關鍵字

如果你想要知道更多可用的 Emmet 關鍵字,建議你去看 Emmet 的官方小抄

備註:由於我平常比較少在玩前端,所以常用的 CSS 就比較少一點,如果你是常玩前端的話,相信 Emmet 應該可以加速你的開發速度 ?


上一篇
DAY 21 HTML 神器 - Emmet (Part 4)
下一篇
DAY 23 整合式終端機 (Part 1)
系列文
精通 Visual Studio Code31
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言