Количество просмотров:
0Базовый синтаксис плагина EMMET
Сокращение при помощи плагина EMMET, позволяет значительно увеличить скорость верстки за счет комбинации команд и аббревиатур. Как пользоваться emmet подробно разбирали в видео уроке "Плагин EMMET молниеносная верстка", где показывал дополнительно как делать свои аббревиатуры. EMMET прост в установке интегрируется в такие редакторы как PHPStorm, Sublime Text, Adobe Dreamviewer, Notepad++, WebStorm, Aptana, Coda, TextMate, Eclipse, CodeMirror, Brackets, Emacs, HippoEDIT, HTML-Kit и други, полный их перечень найдете на сайте EMMET. В данной статье представлены шпаргалки по часто используемым комбинациям с их аббревиатурами по плагину EMMET.
| Сокращение | Расшифровка сокращений |
|---|---|
| Дочерний: > | <!-- nav>ul>li -->
<nav>
<ul>
<li></li>
</ul>
</nav>
|
| Соединение: + |
<!-- div+p+bq --> <div></div> <p></p> <blockquote></blockquote> |
| Поместить выше (в дереве HTML): ^ |
<!-- div+div>p>span+em^bq -->
<div></div>
<div>
<p><span></span><em></em></p>
<blockquote></blockquote>
</div>
<!-- div+div>p>span+em^^bq -->
<div></div>
<div>
<p><span></span><em></em></p>
</div>
<blockquote></blockquote>
|
| Группировка: () |
<!-- div>(header>ul>li*2>a)+footer>p -->
<div>
<header>
<ul>
<li><a href=""></a></li>
<li><a href=""></a></li>
</ul>
</header>
<footer>
<p></p>
</footer>
</div>
|
| Умножение: * |
<!-- ul>li*3 -->
<ul>
<li></li>
<li></li>
<li></li>
</ul>
|
| Нумерация: $ |
<!-- ul>li.item$*3 -->
<ul>
<li class="item1"></li>
<li class="item2"></li>
<li class="item3"></li>
</ul>
<!-- h$[title=item$]{Header $}*3 -->
<h1 title="item1">Header 1</h1>
<h2 title="item2">Header 2</h2>
<h3 title="item3">Header 3</h3>
<!-- ul>li.item$$$*3 -->
<ul>
<li class="item001"></li>
<li class="item002"></li>
<li class="item003"></li>
</ul>
<!-- ul>li.item$@-*3 -->
<ul>
<li class="item3"></li>
<li class="item2"></li>
<li class="item1"></li>
</ul>
<!-- ul>li.item$@3*5 -->
<ul>
<li class="item3"></li>
<li class="item4"></li>
<li class="item5"></li>
<li class="item6"></li>
<li class="item7"></li>
</ul>
|
| id и class |
<!-- #header --> <div id="header"></div> <!-- .title --> <div class="title"></div> <!-- form#search.wide --> <form id="search" class="wide"></form> <!-- p.class1.class2.class3 --> <p class="class1 class2 class3"></p> |
| Атрибуты: [] |
<!-- p[title="Hello world"] --> <p title="Hello world"></p> <!-- td[rowspan=2 colspan=3 title] --> <td rowspan="2" colspan="3" title=""></td> <!-- [a='value1' b="value2"] --> <div a="value1" b="value2"></div> |
| Текст: {} |
<!-- a{Click me} -->
<a href="">Click me</a>
<!-- p>{Click }+a{here}+{ to continue} -->
<p>Click <a href="">here</a> to continue</p>
|
| Сокращение тегов: |
<!-- .class -->
<div class="class"></div>
<!-- em>.class -->
<em><span class="class"></span></em>
<!-- ul>.class -->
<ul>
<li class="class"></li>
</ul>
<!-- table>.row>.col -->
<table>
<tr class="row">
<td class="col"></td>
</tr>
</table>
|
| Генератор текста: lorem |
<!-- .wrapper>h1{My Text}+p*3>lorem5 -->
<div class="wrapper">
<h1>My Text</h1>
<p>Lorem ipsum dolor sit amet.</p>
<p>Debitis dolorum illo nisi suscipit!</p>
<p>Animi explicabo libero quis voluptates?</p>
</div>
|
HTML сокращения в EMMET
| !, html:5 |
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Document</title>
</head>
<body>
</body>
</html>
|
| !!! |
<!DOCTYPE html> |
| a |
<a href=""></a> |
| a:link |
<a href="http://"></a> |
| a:mail |
<a href="mailto:"></a> |
| br |
<br /> |
| frame |
<frame /> |
| link |
<link rel="stylesheet" href="" /> |
| link:css |
<link rel="stylesheet" href="style.css" /> |
| link:favicon |
<link rel="shortcut icon" type="image/x-icon" href="favicon.ico" /> |
| link:rss |
<link rel="alternate" type="application/rss+xml" title="RSS" href="rss.xml" /> |
| meta |
<meta /> |
| meta:utf |
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" /> |
| meta:win |
<meta http-equiv="Content-Type" content="text/html;charset=windows-1251" /> |
| meta:vp |
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0" /> |
| meta:compat |
<meta http-equiv="X-UA-Compatible" content="IE=7" /> |
| style |
<style></style> |
| script |
<script></script> |
| script:src |
<script src=""></script> |
| img |
<img src="" alt="" /> |
| img:srcset, img:s |
<img srcset="" src="" alt="" /> |
| img:sizes, img:z |
<img sizes="" srcset="" src="" alt="" /> |
| map |
<map name=""></map> |
| form |
<form action=""></form> |
| label |
<label for=""></label> |
| input |
<input type="text" /> |
| inp |
<input type="text" name="" id="" /> |
| input:text, input:t |
<input type="text" name="" id="" /> |
| input:search |
<input type="search" name="" id="" /> |
| input:email |
<input type="email" name="" id="" /> |
| input:url |
<input type="url" name="" id="" /> |
| input:password, input:p |
<input type="password" name="" id="" /> |
| input:datetime |
<input type="datetime" name="" id="" /> |
| input:date |
<input type="date" name="" id="" /> |
| input:time |
<input type="time" name="" id="" /> |
| input:tel |
<input type="tel" name="" id="" /> |
| input:number |
<input type="number" name="" id="" /> |
| input:color |
<input type="color" name="" id="" /> |
| input:checkbox, input:c |
<input type="checkbox" name="" id="" /> |
| input:radio, input:r |
<input type="radio" name="" id="" /> |
| input:range |
<input type="range" name="" id="" /> |
| input:file, input:f |
<input type="file" name="" id="" /> |
| input:submit, input:s |
<input type="submit" value="" /> |
| input:image, input:i |
<input type="image" src="" alt="" /> |
| input:button, input:b |
<input type="button" value="" /> |
| input:reset |
<input type="reset" value="" /> |
| select |
<select name="" id=""></select> |
| select:disabled, select:d |
<select name="" id="" disabled="disabled"></select> |
| option, opt |
<option value=""></option> |
| textarea |
<textarea name="" id="" cols="30" rows="10"></textarea> |
| marquee |
<marquee behavior="" direction=""></marquee> |
| menu:context, menu:c |
<menu type="context"></menu> |
| menu:toolbar, menu:t |
<menu type="toolbar"></menu> |
| video |
<video src=""></video> |
| audio |
<audio src=""></audio> |
| html:xml |
<html xmlns="http://www.w3.org/1999/xhtml"></html> |
| keygen |
<keygen /> |
| command |
<command /> |
| button:submit, button:s, btn:s |
<button type="submit"></button> |
| button:reset, button:r, btn:r |
<button type="reset"></button> |
| button:disabled, button:d, btn:d |
<button disabled="disabled"></button> |
| bq |
<blockquote></blockquote> |
| fig |
<figure></figure> |
| figc |
<figcaption></figcaption> |
| pic |
<picture></picture> |
| ifr |
<iframe src="" frameborder="0"></iframe> |
| emb |
<embed src="" type="" /> |
| obj |
<object data="" type=""></object> |
| cap |
<caption></caption> |
| colg |
<colgroup></colgroup> |
| fst, fset |
<fieldset></fieldset> |
| btn |
<button></button> |
| optg |
<optgroup></optgroup> |
| tarea |
<textarea name="" id="" cols="30" rows="10"></textarea> |
| leg |
<legend></legend> |
| sect |
<section></section> |
| art |
<article></article> |
| hdr |
<header></header> |
| ftr |
<footer></footer> |
| adr |
<address></address> |
| dlg |
<dialog></dialog> |
| str |
<strong></strong> |
| prog |
<progress></progress> |
| mn |
<main></main> |
| tem |
<template></template> |
| datag |
<datagrid></datagrid> |
| datal |
<datalist></datalist> |
| kg |
<keygen /> |
| out |
<output></output> |
| det |
<details></details> |
| cmd |
<command /> |
| ol+ |
<ol>
<li></li>
</ol>
|
| ul+ |
<ul>
<li></li>
</ul>
|
| dl+ |
<dl>
<dt></dt>
<dd></dd>
</dl>
|
| map+ |
<map name="">
<area shape="" coords="" href="" alt="" />
</map>
|
| table+ |
<table>
<tr>
<td></td>
</tr>
</table>
|
| colgroup+, colg+ |
<colgroup>
<col />
</colgroup>
|
| tr+ |
<tr>
<td></td>
</tr>
|
| select+ |
<select name="" id="">
<option value=""></option>
</select>
|
| optgroup+, optg+ |
<optgroup>
<option value=""></option>
</optgroup>
|
| pic+ |
<picture>
<source srcset="" />
<img src="" alt="" />
</picture>
|
CSS сокращения в EMMET
| pos |
position:relative; |
| pos:s |
position:static; |
| pos:a |
position:absolute; |
| pos:r |
position:relative; |
| pos:f |
position:fixed; |
| t |
top:; |
| t:a |
top:auto; |
| r |
right:; |
| r:a |
right:auto; |
| b |
bottom:; |
| b:a |
bottom:auto; |
| l |
left:; |
| l:a |
left:auto; |
| z |
z-index:; |
| z:a |
z-index:auto; |
| fl |
float:left; |
| fl:n |
float:none; |
| fl:l |
float:left; |
| fl:r |
float:right; |
| cl |
clear:both; |
| cl:n |
clear:none; |
| cl:l |
clear:left; |
| cl:r |
clear:right; |
| cl:b |
clear:both; |
| d |
display:block; |
| d:n |
display:none; |
| d:b |
display:block; |
| d:f |
display:flex; |
| d:if |
display:inline-flex; |
| d:i |
display:inline; |
| d:ib |
display:inline-block; |
| d:li |
display:list-item; |
| d:ri |
display:run-in; |
| d:cp |
display:compact; |
| d:tb |
display:table; |
| d:itb |
display:inline-table; |
| d:tbcp |
display:table-caption; |
| d:tbcl |
display:table-column; |
| d:tbclg |
display:table-column-group; |
| d:tbhg |
display:table-header-group; |
| d:tbfg |
display:table-footer-group; |
| d:tbr |
display:table-row; |
| d:tbrg |
display:table-row-group; |
| d:tbc |
display:table-cell; |
| d:rb |
display:ruby; |
| d:rbb |
display:ruby-base; |
| d:rbbg |
display:ruby-base-group; |
| d:rbt |
display:ruby-text; |
| d:rbtg |
display:ruby-text-group; |
| v |
visibility:hidden; |
| v:v |
visibility:visible; |
| v:h |
visibility:hidden; |
| v:c |
visibility:collapse; |
| ov |
overflow:hidden; |
| ov:v |
overflow:visible; |
| ov:h |
overflow:hidden; |
| ov:s |
overflow:scroll; |
| ov:a |
overflow:auto; |
| zoo, zm |
zoom:1; |
| cp |
clip:; |
| cp:a |
clip:auto; |
| cp:r |
clip:rect(top right bottom left); |
| rsz |
resize:; |
| rsz:n |
resize:none; |
| cur |
cursor:${pointer};
|
| cur:a |
cursor:auto; |
| cur:d |
cursor:default; |
| cur:c |
cursor:crosshair; |
| cur:ha |
cursor:hand; |
| cur:he |
cursor:help; |
| cur:m |
cursor:move; |
| cur:p |
cursor:pointer; |
| cur:t |
cursor:text; |
| m |
margin:; |
| m:a |
margin:auto; |
| mt |
margin-top:; |
| mt:a |
margin-top:auto; |
| mr |
margin-right:; |
| mr:a |
margin-right:auto; |
| mb |
margin-bottom:; |
| mb:a |
margin-bottom:auto; |
| ml |
margin-left:; |
| ml:a |
margin-left:auto; |
| p |
padding:; |
| pt |
padding-top:; |
| pr |
padding-right:; |
| pb |
padding-bottom:; |
| m:a |
padding-bottom:; |
| pl |
padding-left:; |
| bxz |
box-sizing:border-box; |
| bxz:cb |
box-sizing:content-box; |
| bxz:bb |
box-sizing:border-box; |
| bxsh |
box-shadow:inset hoff voff blur color; |
| bxsh:r |
box-shadow:inset hoff voff blur spread #000000; |
| bxsh:ra |
box-shadow:inset h v blur spread rgba(0, 0, 0, .5); |
| bxsh:n |
box-shadow:none; |
| w |
width:; |
| w:a |
width:auto; |
| h |
height:; |
| h:a |
height:auto; |
| maw |
max-width:; |
| maw:n |
max-width:none; |
| mah |
max-height:; |
| mah:n |
max-height:none; |
| miw |
min-width:; |
| mih |
min-height:; |
| f |
font:; |
| f+ |
font:1em Arial,sans-serif; |
| fw |
font-weight:; |
| fw:n |
font-weight:normal; |
| fw:b |
font-weight:bold; |
| fw:br |
font-weight:bolder; |
| fw:lr |
font-weight:lighter; |
| fs |
font-style:${italic};
|
| fs:n |
font-style:normal; |
| fs:i |
font-style:italic; |
| fs:o |
font-style:oblique; |
| fv |
font-variant:; |
| fv:n |
font-variant:normal; |
| fv:sc |
font-variant:small-caps; |
| fz |
font-size:; |
| fza |
font-size-adjust:; |
| fza:n |
font-size-adjust:none; |
| ff |
font-family:; |
| ff:s |
font-family:serif; |
| ff:ss |
font-family:sans-serif; |
| ff:c |
font-family:cursive; |
| ff:f |
font-family:fantasy; |
| ff:m |
font-family:monospace; |
| ff:a |
font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; |
| ff:t |
font-family: "Times New Roman", Times, Baskerville, Georgia, serif; |
| ff:v |
font-family: Verdana, Geneva, sans-serif; |
| fef |
font-effect:; |
| fef:n |
font-effect:none; |
| fef:eg |
font-effect:engrave; |
| fef:eb |
font-effect:emboss; |
| fef:o |
font-effect:outline; |
| va, va:t |
vertical-align:top; |
| va:sup |
vertical-align:super; |
| va:tt |
vertical-align:text-top; |
| va:m |
vertical-align:middle; |
| va:bl |
vertical-align:baseline; |
| va:b |
vertical-align:bottom; |
| va:tb |
vertical-align:text-bottom; |
| va:sub |
vertical-align:sub; |
| ta, ta:l |
text-align:left; |
| ta:c |
text-align:center; |
| ta:r |
text-align:right; |
| ta:j |
text-align:justify; |
| ta-lst |
text-align-last:; |
| tal:a |
text-align-last:auto; |
| tal:l |
text-align-last:left; |
| tal:c |
text-align-last:center; |
| tal:r |
text-align-last:right; |
| td, td:n |
text-decoration:none; |
| td:u |
text-decoration:underline; |
| td:o |
text-decoration:overline; |
| td:l |
text-decoration:line-through; |
| te |
text-emphasis:; |
| te:n |
text-emphasis:none; |
| te:ac |
text-emphasis:accent; |
| te:dt |
text-emphasis:dot; |
| te:c |
text-emphasis:circle; |
| te:ds |
text-emphasis:disc; |
| te:b |
text-emphasis:before; |
| te:a |
text-emphasis:after; |
| th |
text-height:; |
| th:a |
text-height:auto; |
| th:f |
text-height:font-size; |
| th:t |
text-height:text-size; |
| th:m |
text-height:max-size; |
| ti |
text-indent:; |
| ti:- |
text-indent:-9999px; |
| tj |
text-justify:; |
| tj:a |
text-justify:auto; |
| tj:iw |
text-justify:inter-word; |
| tj:ii |
text-justify:inter-ideograph; |
| tj:ic |
text-justify:inter-cluster; |
| tj:d |
text-justify:distribute; |
| tj:k |
text-justify:kashida; |
| tj:t |
text-justify:tibetan; |
| to |
text-outline:; |
| to+ |
text-outline:0 0 #000; |
| to:n |
text-outline:none; |
| tr |
text-replace:; |
| tr:n |
text-replace:none; |
| tt |
text-transform:uppercase; |
| tt:n |
text-transform:none; |
| tt:c |
text-transform:capitalize; |
| tt:u |
text-transform:uppercase; |
| tt:l |
text-transform:lowercase; |
| tw |
text-wrap:; |
| tw:n |
text-wrap:normal; |
| tw:no |
text-wrap:none; |
| tw:u |
text-wrap:unrestricted; |
| tw:s |
text-wrap:suppress; |
| tsh |
text-shadow:hoff voff blur #000; |
| tsh:r |
text-shadow:h v blur #000000; |
| tsh:ra |
text-shadow:h v blur rgba(0, 0, 0, .5); |
| tsh+ |
text-shadow:0 0 0 #000; |
| tsh:n |
text-shadow:none; |
| lh |
line-height:; |
| lts |
letter-spacing:; |
| lts-n |
letter-spacing:normal; |
| whs |
white-space:; |
| whs:n |
white-space:normal; |
| wob |
word-break:; |
| wob:n |
word-break:normal; |
| wos |
word-spacing:; |
| wow |
word-wrap:; |
| wow:nm |
word-wrap:normal; |
| wow:n |
word-wrap:none |
| bg |
background:#000; |
| bg+ |
background:#fff url() 0 0 no-repeat; |
| bg:n |
background:none; |
| bgc |
background-color:#fff; |
| bgc:t |
background-color:transparent; |
| bgi |
background-image:url(); |
| bgi:n |
background-image:none; |
| bgr |
background-repeat:; |
| bgr:n |
background-repeat:no-repeat; |
| bgr:x |
background-repeat:repeat-x; |
| bgr:y |
background-repeat:repeat-y; |
| bgr:sp |
background-repeat:space; |
| bgr:rd |
background-repeat:round; |
| bga |
background-attachment:; |
| bga:f |
background-attachment:fixed; |
| bga:s |
background-attachment:scroll; |
| bgp |
background-position:0 0; |
| bgpx |
background-position-x:; |
| bgpy |
background-position-y:; |
| bgbk |
background-break:; |
| bgbk:bb |
background-break:bounding-box; |
| bgbk:eb |
background-break:each-box; |
| bgbk:c |
background-break:continuous; |
| bgcp |
background-clip:padding-box; |
| bgcp:bb |
background-clip:border-box; |
| bgcp:pb |
background-clip:padding-box; |
| bgcp:cb |
background-clip:content-box; |
| bgcp:nc |
background-clip:no-clip; |
| bgo |
background-origin:; |
| bgo:pb |
background-origin:padding-box; |
| bgo:bb |
background-origin:border-box; |
| bgo:cb |
background-origin:content-box; |
| bgsz |
background-size:; |
| bgsz:a |
background-size:auto; |
| bgsz:ct |
background-size:contain; |
| bgsz:cv |
background-size:cover; |
| c |
color:#000; |
| c:r |
color:#000000; |
| c:ra |
color:rgba(0, 0, 0, .5); |
| op |
opacity:; |
| cnt |
content:''; |
| cnt:n, ct:n |
content:normal; |
| cnt:oq, ct:oq |
content:open-quote; |
| cnt:noq, ct:noq |
content:no-open-quote; |
| cnt:cq, ct:cq |
content:close-quote; |
| cnt:ncq, ct:ncq |
content:no-close-quote; |
| cnt:a, ct:a |
content:attr(); |
| cnt:c, ct:c |
content:counter(); |
| cnt:cs, ct:cs |
content:counters(); |
| ct |
content:; |
| q |
quotes:; |
| q:n |
quotes:none; |
| q:ru |
quotes:'\00AB' '\00BB' '\201E' '\201C'; |
| q:en |
quotes:'\201C' '\201D' '\2018' '\2019'; |
| coi |
counter-increment:; |
| cor |
counter-reset:; |
| ol |
outline:; |
| ol:n |
outline:none; |
| olo |
outline-offset:; |
| olw |
outline-width:; |
| olw:tn |
outline-width:thin; |
| olw:m |
outline-width:medium; |
| olw:tc |
outline-width:thick; |
| ols |
outline-style:; |
| ols:n |
outline-style:none; |
| ols:dt |
outline-style:dotted; |
| ols:ds |
outline-style:dashed; |
| ols:s |
outline-style:solid; |
| ols:db |
outline-style:double; |
| ols:g |
outline-style:groove; |
| ols:r |
outline-style:ridge; |
| ols:i |
outline-style:inset; |
| ols:o |
outline-style:outset; |
| olc |
outline-color:#000; |
| olc:i |
outline-color:invert; |
| tbl |
table-layout:; |
| tbl:a |
table-layout:auto; |
| tbl:f |
table-layout:fixed; |
| cps |
caption-side:; |
| cps:t |
caption-side:top; |
| cps:b |
caption-side:bottom; |
| ec |
empty-cells:; |
| ec:s |
empty-cells:show; |
| ec:h |
empty-cells:hide; |
| bd |
border:; |
| bd+ |
border:1px solid #000; |
| bd:n |
border:none; |
| bdbk, bdbk:c |
border-break:close; |
| bdcl |
border-collapse:; |
| bdcl:c |
border-collapse:collapse; |
| bdcl:s |
border-collapse:separate; |
| bdc |
border-color:#000; |
| bdc:t |
border-color:transparent; |
| bdi |
border-image:url(); |
| bdi:n |
border-image:none; |
| bdti |
border-top-image:url(); |
| bdti:n |
border-top-image:none; |
| bdri |
border-right-image:url(); |
| bdri:n |
border-right-image:none; |
| bdbi |
border-bottom-image:url(); |
| bdbi:n |
border-bottom-image:none; |
| bdli |
border-left-image:url(); |
| bdli:n |
border-left-image:none; |
| bdci |
border-corner-image:url(); |
| bdci:n |
border-corner-image:none; |
| bdci:c |
border-corner-image:continue; |
| bdtli |
border-top-left-image:url(); |
| bdtli:n |
border-top-left-image:none; |
| bdtli:c |
border-top-left-image:continue; |
| bdtri |
border-top-right-image:url(); |
| bdtri:n |
border-top-right-image:none; |
| bdtri:c |
border-top-right-image:continue; |
| bdbri |
border-bottom-right-image:url(); |
| bdbri:n |
border-bottom-right-image:none; |
| bdbri:c |
border-bottom-right-image:continue; |
| bdbli |
border-bottom-left-image:url(); |
| bdbli:n |
border-bottom-left-image:none; |
| bdbli:c |
border-bottom-left-image:continue; |
| bdf |
border-fit:repeat; |
| bdf:c |
border-fit:clip; |
| bdf:r |
border-fit:repeat; |
| bdf:sc |
border-fit:scale; |
| bdf:st |
border-fit:stretch; |
| bdf:ow |
border-fit:overwrite; |
| bdf:of |
border-fit:overflow; |
| bdf:sp |
border-fit:space; |
| bdlen |
border-length:; |
| bdlen:a |
border-length:auto; |
| bdsp |
border-spacing:; |
| bds |
border-style:; |
| bds:n |
border-style:none; |
| bds:h |
border-style:hidden; |
| bds:dt |
border-style:dotted; |
| bds:ds |
border-style:dashed; |
| bds:s |
border-style:solid; |
| bds:db |
border-style:double; |
| bds:dtds |
border-style:dot-dash; |
| bds:dtdtds |
border-style:dot-dot-dash; |
| bds:w |
border-style:wave; |
| bds:g |
border-style:groove; |
| bds:r |
border-style:ridge; |
| bds:i |
border-style:inset; |
| bds:o |
border-style:outset; |
| bdw |
border-width:; |
| bdt, bt |
border-top:; |
| bdt+ |
border-top:1px solid #000; |
| bdt:n |
border-top:none; |
| bdtw |
border-top-width:; |
| bdts |
border-top-style:; |
| bdts:n |
border-top-style:none; |
| bdtc |
border-top-color:#000; |
| bdtc:t |
border-top-color:transparent; |
| bdr, br |
border-right:; |
| bdr+ |
border-right:1px solid #000; |
| bdr:n |
border-right:none; |
| bdrw |
border-right-width:; |
| bdrst |
border-right-style:; |
| bdrst:n |
border-right-style:none; |
| bdrc |
border-right-color:#000; |
| bdrc:t |
border-right-color:transparent; |
| bdb, bb |
border-bottom:; |
| bdb+ |
border-bottom:1px solid #000; |
| bdb:n |
border-bottom:none; |
| bdbw |
border-bottom-width:; |
| bdbs |
border-bottom-style:; |
| bdbs:n |
border-bottom-style:none; |
| bdbc |
border-bottom-color:#000; |
| bdbc:t |
border-bottom-color:transparent; |
| bdl, bl |
border-left:; |
| bdl+ |
border-left:1px solid #000; |
| bdl:n |
border-left:none; |
| bdlw |
border-left-width:; |
| bdls |
border-left-style:; |
| bdls:n |
border-left-style:none; |
| bdlc |
border-left-color:#000; |
| bdlc:t |
border-left-color:transparent; |
| bdrs |
border-radius:; |
| bdtrrs |
border-top-right-radius:; |
| bdtlrs |
border-top-left-radius:; |
| bdbrrs |
border-bottom-right-radius:; |
| bdblrs |
border-bottom-left-radius:; |
| lis |
list-style:; |
| lis:n |
list-style:none; |
| lisp |
list-style-position:; |
| lisp:i |
list-style-position:inside; |
| lisp:o |
list-style-position:outside; |
| list |
list-style-type:; |
| list:n |
list-style-type:none; |
| list:d |
list-style-type:disc; |
| list:c |
list-style-type:circle; |
| list:s |
list-style-type:square; |
| list:dc |
list-style-type:decimal; |
| list:dclz |
list-style-type:decimal-leading-zero; |
| list:lr |
list-style-type:lower-roman; |
| list:ur |
list-style-type:upper-roman; |
| lisi |
list-style-image:; |
| lisi:n |
list-style-image:none; |
| pgbb |
page-break-before:; |
| pgbb:au |
page-break-before:auto; |
| pgbb:al |
page-break-before:always; |
| pgbb:l |
page-break-before:left; |
| pgbb:r |
page-break-before:right; |
| pgbi |
page-break-inside:; |
| pgbi:au |
page-break-inside:auto; |
| pgbi:av |
page-break-inside:avoid; |
| pgba |
page-break-after:; |
| pgba:au |
page-break-after:auto; |
| pgba:al |
page-break-after:always; |
| pgba:l |
page-break-after:left; |
| pgba:r |
page-break-after:right; |
| orp |
orphans:; |
| wid |
widows:; |
| ac |
align-content:; |
| ac:c |
align-content:center; |
| ac:fe |
align-content:flex-end; |
| ac:fs |
align-content:flex-start; |
| ac:s |
align-content:stretch; |
| ac:sa |
align-content:space-around; |
| ac:sb |
align-content:space-between; |
| ai |
align-items:; |
| ai:b |
align-items:baseline; |
| ai:c |
align-items:center; |
| ai:fe |
align-items:flex-end; |
| ai:fs |
align-items:flex-start; |
| ai:s |
align-items:stretch; |
| anim |
animation:; |
| anim- |
animation:name duration timing-function delay iteration-count direction fill-mode; |
| animdel |
animation-delay:time; |
| animdir |
animation-direction:normal; |
| animdir:a |
animation-direction:alternate; |
| animdir:ar |
animation-direction:alternate-reverse; |
| animdir:n |
animation-direction:normal; |
| animdir:r |
animation-direction:reverse; |
| animdur |
animation-duration:0s; |
| animfm |
animation-fill-mode:both; |
| animfm:b |
animation-fill-mode:backwards; |
| animfm:bt, animfm:bh |
animation-fill-mode:both; |
| animfm:f |
animation-fill-mode:forwards; |
| animic |
animation-iteration-count:1; |
| animic:i |
animation-iteration-count:infinite; |
| animn |
animation-name:none; |
| animps |
animation-play-state:running; |
| animps:p |
animation-play-state:paused; |
| animps:r |
animation-play-state:running; |
| animtf |
animation-timing-function:linear; |
| animtf:cb |
animation-timing-function:cubic-bezier(0.1, 0.7, 1.0, 0.1); |
| animtf:e |
animation-timing-function:ease; |
| animtf:ei |
animation-timing-function:ease-in; |
| animtf:eio |
animation-timing-function:ease-in-out; |
| animtf:eo |
animation-timing-function:ease-out; |
| animtf:l |
animation-timing-function:linear; |
| fx |
flex:; |
| fxb |
flex-basis:; |
| fxd |
flex-direction:; |
| fxd:c |
flex-direction:column; |
| fxd:cr |
flex-direction:column-reverse; |
| fxd:r |
flex-direction:row; |
| fxd:rr |
flex-direction:row-reverse; |
| fxf |
flex-flow:; |
| fxg |
flex-grow:; |
| fxsh |
flex-shrink:; |
| fxw |
flex-wrap: ; |
| fxw:n |
flex-wrap:nowrap; |
| fxw:w |
flex-wrap:wrap; |
| fxw:wr |
flex-wrap:wrap-reverse; |
| trf |
transform:; |
| trf:r |
transform: rotate(angle); |
| trf:rx |
transform: rotateX(angle); |
| trf:ry |
transform: rotateY(angle); |
| trf:rz |
transform: rotateZ(angle); |
| trf:sc |
transform: scale(x, y); |
| trf:sc3 |
transform: scale3d(x, y, z); |
| trf:scx |
transform: scaleX(x); |
| trf:scy |
transform: scaleY(y); |
| trf:scz |
transform: scaleZ(z); |
| trf:skx |
transform: skewX(angle); |
| trf:sky |
transform: skewY(angle); |
| trf:t |
transform: translate(x, y); |
| trf:t3 |
transform: translate3d(tx, ty, tz); |
| trf:tx |
transform: translateX(x); |
| trf:ty |
transform: translateY(y); |
| trf:tz |
transform: translateZ(z); |
| trfo |
transform-origin:; |
| trfs |
transform-style:preserve-3d; |
| trs |
transition:prop time; |
| trsde |
transition-delay:time; |
| trsdu |
transition-duration:time; |
| trsp |
transition-property:prop; |
| trstf |
transition-timing-function:tfunc; |
| ! |
!important |
| @f |
@font-face {
font-family:;
src:url(|);
}
|
| @f+ |
@font-face {
font-family: 'FontName';
src: url('FileName.eot');
src: url('FileName.eot?#iefix') format('embedded-opentype'),
url('FileName.woff') format('woff'),
url('FileName.ttf') format('truetype'),
url('FileName.svg#FontName') format('svg');
font-style: normal;
font-weight: normal;
}
|
| @i, @import |
@import url(); |
| @kf |
@-webkit-keyframes identifier {
from { }
to { }
}
@-o-keyframes identifier {
from { }
to { }
}
@-moz-keyframes identifier {
from { }
to { }
}
@keyframes identifier {
from { }
to { }
}
|
| @m, @media |
@media screen {
}
|
| jc |
justify-content:; |
| jc:c |
justify-content:center; |
| jc:fe |
justify-content:flex-end; |
| jc:fs |
justify-content:flex-start; |
| jc:sa |
justify-content:space-around; |
| jc:sb |
justify-content:space-between; |
| op+ |
opacity: ; filter: alpha(opacity=) |
| tov |
text-overflow:${ellipsis};
|
| tov:c |
text-overflow:clip; |
| tov:e |
text-overflow:ellipsis; |
Загрузка...