省エネ入力!CSSのEmmet書式を調べるための逆引き辞典

サイバーマンデー
Amazonプライム会員限定の大セール「サイバーマンデー」開催中!プライム会員限定の大セール

Emmetを利用していて「あのCSSは、どう書くんだったっけ?」なんてことがたまにあります。

そんな時は、Emmetのチートシートで調べれば分かるのですが、プロパティ名順になっていないので、見つけるのに大変だったり、ページ検索などを使う必要があったりして、ちょっと面倒だったりします。

そんなときのために、プロパティ名からEmmetの書き方を調べられる表を作成してみました。「あのプロパティーは、どう書くと楽なんだっけ?」なんてことを調べるときにご利用ください。

photo by Maurice Svay

スポンサーリンク
レクタングル(大)広告

目次

プロパティ名先頭のアルファベットを選んでください。

A B C D E F H J L M O P Q R T U V W Z

A

プロパティと値 短縮入力文字
align-content:; ac
align-content:center; ac:c
align-content:flex-end; ac:fe
align-content:flex-start; ac:fs
align-content:space-around; ac:sa
align-content:space-between; ac:sb
align-content:stretch; ac:s
align-items:; ai
align-items:baseline; ai:b
align-items:center; ai:c
align-items:flex-end; ai:fe
align-items:flex-start; ai:fs
align-items:stretch; ai:s
align-self:; as
align-self:auto; as:a
align-self:baseline; as:b
align-self:center; as:c
align-self:flex-end; as:fe
align-self:flex-start; as:fs
align-self:stretch; as:s
animation-delay:time; animdel
animation-direction:alternate-reverse; animdir:ar
animation-direction:alternate; animdir:a
animation-direction:normal; animdir
animation-direction:normal; animdir:n
animation-direction:reverse; animdir:r
animation-duration:0s; animdur
animation-fill-mode:backwards; animfm:b
animation-fill-mode:both; animfm
animation-fill-mode:both; animfm:bt, animfm:bh
animation-fill-mode:forwards; animfm:f
animation-iteration-count:1; animic
animation-iteration-count:infinite; animic:i
animation-name:none; animn
animation-play-state:paused; animps:p
animation-play-state:running; animps:r
animation-play-state:running; animps
animation-timing-function:cubic-bezier(0.1, 0.7, 1.0, 0.1); animtf:cb
animation-timing-function:ease-in-out; animtf:eio
animation-timing-function:ease-in; animtf:ei
animation-timing-function:ease-out; animtf:eo
animation-timing-function:ease; animtf:e
animation-timing-function:linear; animtf:l
animation-timing-function:linear; animtf
animation:; anim
animation:name duration timing-function delay iteration-count direction fill-mode; anim-
appearance:${none}; ap

B

プロパティと値 短縮入力文字
backface-visibility:; bfv
backface-visibility:hidden; bfv:h
backface-visibility:visible; bfv:v
background-attachment:; bga
background-attachment:fixed; bga:f
background-attachment:scroll; bga:s
background-break:; bgbk
background-break:bounding-box; bgbk:bb
background-break:continuous; bgbk:c
background-break:each-box; bgbk:eb
background-clip:border-box; bgcp:bb
background-clip:content-box; bgcp:cb
background-clip:no-clip; bgcp:nc
background-clip:padding-box; bgcp
background-clip:padding-box; bgcp:pb
background-color:#fff; bgc
background-color:transparent; bgc:t
background-image:none; bgi:n
background-image:url(); bgi
background-origin:; bgo
background-origin:border-box; bgo:bb
background-origin:content-box; bgo:cb
background-origin:padding-box; bgo:pb
background-position-x:; bgpx
background-position-y:; bgpy
background-position:0 0; bgp
background-repeat:; bgr
background-repeat:no-repeat; bgr:n
background-repeat:repeat-x; bgr:x
background-repeat:repeat-y; bgr:y
background-repeat:round; bgr:rd
background-repeat:space; bgr:sp
background-size:; bgsz
background-size:auto; bgsz:a
background-size:contain; bgsz:ct
background-size:cover; bgsz:cv
background:#000; bg
background:#fff url() 0 0 no-repeat; bg+
background:none; bg:n
border-bottom-color:#000; bdbc
border-bottom-color:transparent; bdbc:t
border-bottom-image:none; bdbi:n
border-bottom-image:url(); bdbi
border-bottom-left-image:continue; bdbli:c
border-bottom-left-image:none; bdbli:n
border-bottom-left-image:url(); bdbli
border-bottom-left-radius:; bdblrs
border-bottom-right-image:continue; bdbri:c
border-bottom-right-image:none; bdbri:n
border-bottom-right-image:url(); bdbri
border-bottom-right-radius:; bdbrrs
border-bottom-style:; bdbs
border-bottom-style:none; bdbs:n
border-bottom-width:; bdbw
border-bottom:1px solid #000; bdb+
border-bottom:; bdb, bb
border-bottom:none; bdb:n
border-break:close; bdbk
border-break:close; bdbk:c
border-collapse:; bdcl
border-collapse:collapse; bdcl:c
border-collapse:separate; bdcl:s
border-color:#000; bdc
border-color:transparent; bdc:t
border-corner-image:continue; bdci:c
border-corner-image:none; bdci:n
border-corner-image:url(); bdci
border-fit:clip; bdf:c
border-fit:overflow; bdf:of
border-fit:overwrite; bdf:ow
border-fit:repeat; bdf:r
border-fit:repeat; bdf
border-fit:scale; bdf:sc
border-fit:space; bdf:sp
border-fit:stretch; bdf:st
border-image:none; bdi:n
border-image:url(); bdi
border-left-color:#000; bdlc
border-left-color:transparent; bdlc:t
border-left-image:none; bdli:n
border-left-image:url(); bdli
border-left-style:; bdls
border-left-style:none; bdls:n
border-left-width:; bdlw
border-left:1px solid #000; bdl+
border-left:; bdl, bl
border-left:none; bdl:n
border-length:; bdlen
border-length:auto; bdlen:a
border-radius:; bdrs
border-right-color:#000; bdrc
border-right-color:transparent; bdrc:t
border-right-image:none; bdri:n
border-right-image:url(); bdri
border-right-style:; bdrst
border-right-style:none; bdrst:n
border-right-width:; bdrw
border-right:1px solid #000; bdr+
border-right:; bdr, br
border-right:none; bdr:n
border-spacing:; bdsp
border-style:; bds
border-style:dashed; bds:ds
border-style:dot-dash; bds:dtds
border-style:dot-dot-dash; bds:dtdtds
border-style:dotted; bds:dt
border-style:double; bds:db
border-style:groove; bds:g
border-style:hidden; bds:h
border-style:inset; bds:i
border-style:none; bds:n
border-style:outset; bds:o
border-style:ridge; bds:r
border-style:solid; bds:s
border-style:wave; bds:w
border-top-color:#000; bdtc
border-top-color:transparent; bdtc:t
border-top-image:none; bdti:n
border-top-image:url(); bdti
border-top-left-image:continue; bdtli:c
border-top-left-image:none; bdtli:n
border-top-left-image:url(); bdtli
border-top-left-radius:; bdtlrs
border-top-right-image:continue; bdtri:c
border-top-right-image:none; bdtri:n
border-top-right-image:url(); bdtri
border-top-right-radius:; bdtrrs
border-top-style:; bdts
border-top-style:none; bdts:n
border-top-width:; bdtw
border-top:1px solid #000; bdt+
border-top:; bdt, bt
border-top:none; bdt:n
border-width:; bdw
border:1px solid #000; bd+
border:; bd
border:none; bd:n
bottom:; b
bottom:auto; b:a
box-shadow:inset h v blur spread rgba(0, 0, 0, .5); bxsh:ra
box-shadow:inset hoff voff blur color; bxsh
box-shadow:inset hoff voff blur spread rgb(0, 0, 0); bxsh:r
box-shadow:none; bxsh:n
box-sizing:border-box; bxz
box-sizing:border-box; bxz:bb
box-sizing:content-box; bxz:cb

C

プロパティと値 短縮入力文字
caption-side:; cps
caption-side:bottom; cps:b
caption-side:top; cps:t
clear:both; cl:b
clear:both; cl
clear:left; cl:l
clear:none; cl:n
clear:right; cl:r
clip:; cp
clip:auto; cp:a
clip:rect(top right bottom left); cp:r
color:#000; c
color:rgb(0, 0, 0); c:r
color:rgba(0, 0, 0, .5); c:ra
column-count:; colmc
column-fill:; colmf
column-gap:; colmg
column-rule-color:; colmrc
column-rule-style:; colmrs
column-rule-width:; colmrw
column-rule:; colmr
column-span:; colms
column-width:; colmw
columns:; colm
content:”; cnt
content:; ct
content:attr(); cnt:a, ct:a
content:close-quote; cnt:cq, ct:cq
content:counter(); cnt:c, ct:c
content:counters(); cnt:cs, ct:cs
content:no-close-quote; cnt:ncq, ct:ncq
content:no-open-quote; cnt:noq, ct:noq
content:normal; cnt:n, ct:n
content:open-quote; cnt:oq, ct:oq
counter-increment:; coi
counter-reset:; cor
cursor:${pointer}; cur
cursor:auto; cur:a
cursor:crosshair; cur:c
cursor:default; cur:d
cursor:hand; cur:ha
cursor:help; cur:he
cursor:move; cur:m
cursor:pointer; cur:p
cursor:text; cur:t

D

プロパティと値 短縮入力文字
display: inline-block; d:ib+
display:block; d:b
display:block; d
display:compact; d:cp
display:flex; d:f
display:inline-block; d:ib
display:inline-flex; d:if
display:inline-table; d:itb
display:inline; d:i
display:list-item; d:li
display:none; d:n
display:ruby-base-group; d:rbbg
display:ruby-base; d:rbb
display:ruby-text-group; d:rbtg
display:ruby-text; d:rbt
display:ruby; d:rb
display:run-in; d:ri
display:table-caption; d:tbcp
display:table-cell; d:tbc
display:table-column-group; d:tbclg
display:table-column; d:tbcl
display:table-footer-group; d:tbfg
display:table-header-group; d:tbhg
display:table-row-group; d:tbrg
display:table-row; d:tbr
display:table; d:tb

E

プロパティと値 短縮入力文字
empty-cells:; ec
empty-cells:hide; ec:h
empty-cells:show; ec:s

F

プロパティと値 短縮入力文字
filter: alpha(opacity=); opacity: ;
filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=100); op:ie
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=’x.png’,sizingMethod=’crop’); bg:ie
flex-basis:; fxb
flex-direction:; fxd
flex-direction:column-reverse; fxd:cr
flex-direction:column; fxd:c
flex-direction:row-reverse; fxd:rr
flex-direction:row; fxd:r
flex-flow:; fxf
flex-grow:; fxg
flex-shrink:; fxsh
flex-wrap: ; fxw
flex-wrap:nowrap; fxw:n
flex-wrap:wrap-reverse; fxw:wr
flex-wrap:wrap; fxw:w
flex:; fx
float:left; fl
float:left; fl:l
float:none; fl:n
float:right; fl:r
font-effect:; fef
font-effect:emboss; fef:eb
font-effect:engrave; fef:eg
font-effect:none; fef:n
font-effect:outline; fef:o
font-emphasize-position:; femp
font-emphasize-position:after; femp:a
font-emphasize-position:before; femp:b
font-emphasize-style:; fems
font-emphasize-style:accent; fems:ac
font-emphasize-style:circle; fems:c
font-emphasize-style:disc; fems:ds
font-emphasize-style:dot; fems:dt
font-emphasize-style:none; fems:n
font-emphasize:; fem
font-family: "Times New Roman", Times, Baskerville, Georgia, serif; ff:t
font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; ff:a
font-family: Verdana, Geneva, sans-serif; ff:v
font-family:; ff
font-family:cursive; ff:c
font-family:fantasy; ff:f
font-family:monospace; ff:m
font-family:sans-serif; ff:ss
font-family:serif; ff:s
font-size-adjust:; fza
font-size-adjust:none; fza:n
font-size:; fz
font-smooth:; fsm
font-smooth:always; fsm:aw
font-smooth:auto; fsm:a
font-smooth:never; fsm:n
font-stretch:; fst
font-stretch:condensed; fst:c
font-stretch:expanded; fst:e
font-stretch:extra-condensed; fst:ec
font-stretch:extra-expanded; fst:ee
font-stretch:normal; fst:n
font-stretch:semi-condensed; fst:sc
font-stretch:semi-expanded; fst:se
font-stretch:ultra-condensed; fst:uc
font-stretch:ultra-expanded; fst:ue
font-style:${italic}; fs
font-style:italic; fs:i
font-style:normal; fs:n
font-style:oblique; fs:o
font-variant:; fv
font-variant:normal; fv:n
font-variant:small-caps; fv:sc
font-weight:; fw
font-weight:bold; fw:b
font-weight:bolder; fw:br
font-weight:lighter; fw:lr
font-weight:normal; fw:n
font:1em Arial,sans-serif; f+
font:; f

H

プロパティと値 短縮入力文字
height:; h
height:auto; h:a

J

プロパティと値 短縮入力文字
justify-content:; jc
justify-content:center; jc:c
justify-content:flex-end; jc:fe
justify-content:flex-start; jc:fs
justify-content:space-around; jc:sa
justify-content:space-between; jc:sb

L

プロパティと値 短縮入力文字
left:; l
left:auto; l:a
letter-spacing:; lts
letter-spacing:normal; lts-n
line-height:; lh
list-style-image:; lisi
list-style-image:none; lisi:n
list-style-position:; lisp
list-style-position:inside; lisp:i
list-style-position:outside; lisp:o
list-style-type:; list
list-style-type:circle; list:c
list-style-type:decimal-leading-zero; list:dclz
list-style-type:decimal; list:dc
list-style-type:disc; list:d
list-style-type:lower-roman; list:lr
list-style-type:none; list:n
list-style-type:square; list:s
list-style-type:upper-roman; list:ur
list-style:; lis
list-style:none; lis:n

M

プロパティと値 短縮入力文字
margin-bottom:; mb
margin-bottom:auto; mb:a
margin-left:; ml
margin-left:auto; ml:a
margin-right:; mr
margin-right:auto; mr:a
margin-top:; mt
margin-top:auto; mt:a
margin:; m
margin:auto; m:a
max-height:; mah
max-height:none; mah:n
max-resolution:res; mar
max-width:; maw
max-width:none; maw:n
min-height:; mih
min-resolution:res; mir
min-width:; miw

O

プロパティと値 短縮入力文字
opacity: ; op+
opacity:; op
order:; ord
orientation:; ori
orientation:landscape; ori:l
orientation:portrait; ori:p
orphans:; orp
outline-color:#000; olc
outline-color:invert; olc:i
outline-offset:; olo
outline-style:; ols
outline-style:dashed; ols:ds
outline-style:dotted; ols:dt
outline-style:double; ols:db
outline-style:groove; ols:g
outline-style:inset; ols:i
outline-style:none; ols:n
outline-style:outset; ols:o
outline-style:ridge; ols:r
outline-style:solid; ols:s
outline-width:; olw
outline-width:medium; olw:m
outline-width:thick; olw:tc
outline-width:thin; olw:tn
outline:; ol
outline:none; ol:n
overflow-style:auto; ovs:a
overflow-style:marquee; ovs:mq
overflow-style:move; ovs:m
overflow-style:panner; ovs:p
overflow-style:scrollbar; ovs
overflow-style:scrollbar; ovs:s
overflow-x:auto; ovx:a
overflow-x:hidden; ovx
overflow-x:hidden; ovx:h
overflow-x:scroll; ovx:s
overflow-x:visible; ovx:v
overflow-y:auto; ovy:a
overflow-y:hidden; ovy
overflow-y:hidden; ovy:h
overflow-y:scroll; ovy:s
overflow-y:visible; ovy:v
overflow:auto; ov:a
overflow:hidden; ov:h
overflow:hidden; ov
overflow:scroll; ov:s
overflow:visible; ov:v

P

プロパティと値 短縮入力文字
padding-bottom:; pb
padding-left:; pl
padding-right:; pr
padding-top:; pt
padding:; p
page-break-after:; pgba
page-break-after:always; pgba:al
page-break-after:auto; pgba:au
page-break-after:left; pgba:l
page-break-after:right; pgba:r
page-break-before:; pgbb
page-break-before:always; pgbb:al
page-break-before:auto; pgbb:au
page-break-before:left; pgbb:l
page-break-before:right; pgbb:r
page-break-inside:; pgbi
page-break-inside:auto; pgbi:au
page-break-inside:avoid; pgbi:av
position:absolute; pos:a
position:fixed; pos:f
position:relative; pos
position:relative; pos:r
position:static; pos:s

Q

プロパティと値 短縮入力文字
quotes:’\00AB’ ‘\00BB’ ‘\201E’ ‘\201C’; q:ru
quotes:’\201C’ ‘\201D’ ‘\2018’ ‘\2019’; q:en
quotes:; q
quotes:none; q:n

R

プロパティと値 短縮入力文字
resize:; rsz
resize:both; rsz:b
resize:horizontal; rsz:h
resize:none; rsz:n
resize:vertical; rsz:v
right:; r
right:auto; r:a

T

プロパティと値 短縮入力文字
table-layout:; tbl
table-layout:auto; tbl:a
table-layout:fixed; tbl:f
text-align-last:; ta-lst
text-align-last:auto; tal:a
text-align-last:center; tal:c
text-align-last:left; tal:l
text-align-last:right; tal:r
text-align:center; ta:c
text-align:justify; ta:j
text-align:left; ta:l
text-align:left; ta
text-align:right; ta:r
text-decoration:line-through; td:l
text-decoration:none; td:n
text-decoration:none; td
text-decoration:overline; td:o
text-decoration:underline; td:u
text-emphasis:; te
text-emphasis:accent; te:ac
text-emphasis:after; te:a
text-emphasis:before; te:b
text-emphasis:circle; te:c
text-emphasis:disc; te:ds
text-emphasis:dot; te:dt
text-emphasis:none; te:n
text-height:; th
text-height:auto; th:a
text-height:font-size; th:f
text-height:max-size; th:m
text-height:text-size; th:t
text-indent:-9999px; ti:-
text-indent:; ti
text-justify:; tj
text-justify:auto; tj:a
text-justify:distribute; tj:d
text-justify:inter-cluster; tj:ic
text-justify:inter-ideograph; tj:ii
text-justify:inter-word; tj:iw
text-justify:kashida; tj:k
text-justify:tibetan; tj:t
text-outline:0 0 #000; to+
text-outline:; to
text-outline:none; to:n
text-overflow:${ellipsis}; tov
text-overflow:clip; tov:c
text-overflow:ellipsis; tov:e
text-replace:; tr
text-replace:none; tr:n
text-shadow:0 0 0 #000; tsh+
text-shadow:h v blur rgb(0, 0, 0); tsh:r
text-shadow:h v blur rgba(0, 0, 0, .5); tsh:ra
text-shadow:hoff voff blur #000; tsh
text-shadow:none; tsh:n
text-transform:capitalize; tt:c
text-transform:lowercase; tt:l
text-transform:none; tt:n
text-transform:uppercase; tt:u
text-transform:uppercase; tt
text-wrap:; tw
text-wrap:none; tw:no
text-wrap:normal; tw:n
text-wrap:suppress; tw:s
text-wrap:unrestricted; tw:u
top:; t
top:auto; t:a
transform-origin:; trfo
transform-style:preserve-3d; trfs
transform: rotate(angle); trf:r
transform: rotateX(angle); trf:rx
transform: rotateY(angle); trf:ry
transform: rotateZ(angle); trf:rz
transform: scale(x, y); trf:sc
transform: scale3d(x, y, z); trf:sc3
transform: scaleX(x); trf:scx
transform: scaleY(y); trf:scy
transform: scaleZ(z); trf:scz
transform: skewX(angle); trf:skx
transform: skewY(angle); trf:sky
transform: translate(x, y); trf:t
transform: translate3d(tx, ty, tz); trf:t3
transform: translateX(x); trf:tx
transform: translateY(y); trf:ty
transform: translateZ(z); trf:tz
transform:; trf
transition-delay:time; trsde
transition-duration:time; trsdu
transition-property:prop; trsp
transition-timing-function:tfunc; trstf
transition:prop time; trs

U

プロパティと値 短縮入力文字
user-select:${none}; us

V

プロパティと値 短縮入力文字
vertical-align:baseline; va:bl
vertical-align:bottom; va:b
vertical-align:middle; va:m
vertical-align:sub; va:sub
vertical-align:super; va:sup
vertical-align:text-bottom; va:tb
vertical-align:text-top; va:tt
vertical-align:top; va
vertical-align:top; va:t
visibility:collapse; v:c
visibility:hidden; v:h
visibility:hidden; v
visibility:visible; v:v

W

プロパティと値 短縮入力文字
white-space-collapse:; whsc
white-space-collapse:break-all; whsc:ba
white-space-collapse:break-strict; whsc:bs
white-space-collapse:keep-all; whsc:k
white-space-collapse:loose; whsc:l
white-space-collapse:normal; whsc:n
white-space:; whs
white-space:normal; whs:n
white-space:nowrap; whs:nw
white-space:pre-line; whs:pl
white-space:pre-wrap; whs:pw
white-space:pre; whs:p
widows:; wid
width:; w
width:auto; w:a
word-break:; wob
word-break:break-all; wob:ba
word-break:keep-all; wob:k
word-break:normal; wob:n
word-spacing:; wos
word-wrap:; wow
word-wrap:break-word; wow:b
word-wrap:none; wow:n
word-wrap:normal; wow:nm
word-wrap:suppress; wow:s
word-wrap:unrestricted; wow:u
writing-mode:bt-lr; wm:btl
writing-mode:bt-rl; wm:btr
writing-mode:lr-bt; wm:lrb
writing-mode:lr-tb; wm
writing-mode:lr-tb; wm:lrt
writing-mode:rl-bt; wm:rlb
writing-mode:rl-tb; wm:rlt
writing-mode:tb-lr; wm:tbl
writing-mode:tb-rl; wm:tbr

Z

プロパティと値 短縮入力文字
z-index:; z
z-index:auto; z:a
zoom:1; zoo, zm

まとめ

今回は、Emmetのチートシートのテキストを取得して、Rubyで整形&並び替えの処理をしました。

一応、内容の確認はしましたが、もし処理ミスで間違ってたらすいません。コメントいただければ、修正いたします。