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

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で整形&並び替えの処理をしました。

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