Cheatography
https://cheatography.com
Syntax> | Child - nav>ul>li | + | Sibling - div+p+bq | ^ | Climb up - div+div>p>span+em^bq | ( ) | Grouping - div>(header>ul>li*2>a)+footer>p | * | Multiplication - ul>li*5 | $ | Numbering - ul>li.item$*5 | . | Class - h1.title or p.class1.class2.class3 | # | ID - div.#header or form#search.wide | [ ] | Custom attributes - td[rowspan=2 colspan=3 title] | { } | Text - p>{Click }+a{here}+{ to continue} |
HTML! | Create HTML5 template | a | <a href=""></a>
| a:link | <a href="http://"></a>
| a:mail | <a href="mailto:"></a>
| link | <link rel="stylesheet" href="" />
| meta | <meta />
| meta:utf | <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
| style | <style></style>
| script | <script></script>
| script:src | <script src=""></script>
| img | <img src="" alt="" />
| form | <form action=""></form>
| form:get | <form action="" method="get"></form>
| form:post | <form action="" method="post"></form>
| label | <label for=""></label>
| inp | <input type="text" name="" id="" />
| input:email | <input type="email" name="" id="" />
| input:p | <input type="password" name="" id="" />
| input:c | <input type="checkbox" name="" id="" />
| input:r | <input type="radio" name="" id="" />
| input:f | <input type="file" name="" id="" />
| select | <select name="" id=""></select>
| option | <option value=""></option>
| textarea | <textarea name="" id="" cols="30" rows="10"></textarea>
| btn:s | <button type="submit"></button>
| btn | <button></button>
| sect | <section></section>
| art | <article></article>
| hdr | <header></header>
| ftr | <footer></footer>
| mn | <main></main>
| ol+ | <ol>
<li></li>
</ol>
| ul+ | <ul>
<li></li>
</ul>
| dl+ | <ol>
<dt></dt>
<dd></dd>
</ol>
| table+ | <table>
<tr>
<td></td>
</tr>
</table>
| tr+ | <tr>
<td></td>
</tr>
|
| | CSSpos:(a|r|f) | position:absolute|relative|fixed;
| t | top
| r | right
| b | bottom
| l | left
| z | z-index
| fl:(n|r|l) | float:none|right|left;
| cl:(n|b|l|r) | clear: none|both|left|right;
| d:(n|b|f|i|ib) | display: none|block|flex|inline|inline-block;
| v:(v|h) | visibility: visible|hidden;
| ov:(v|h|s) | overflow: visible|hidden|scroll;
| ovx:() | overflow-x: visible|hidden|scroll;
| ovy:() | overflow-y: visible|hidden|scroll;
| m | margin
| m(r|t|b|l) | margin-right|top|bottom|left;
| p | padding
| p(t|r|b|l) | padding-top|right|bottom|left;
| bxz:bb | box-sizing: border-box;
| w | width
| h | height
| maw | max-width
| mah | max-height
| miw | min-width
| mih | min-height
| fw | font-weight
| fz | font-size
| ff | font-family
| ta:(l|c|r|j) | text-align: left|center|right|justify;
| td:n | text-decoration: none;
| lh | line-height
| bg:n | background: none
| bg+ | background: #fff url() 0 0 no-repeat;
| c:(r|ra) | color: rgb()|rgba();
| op | opacity
| cnt | content:'';
| ol:n | outline: none;
| bd+ | border: 1px solid #000;
| bd:n | border: none;
| bd(t|r|l|b)+ | border-top|right|left|bottom: 1px solid #000;
| bdrs | border-radius
| lis:n | list-style: none;
| ! | !important
| @f | font-face
| @kf | keyframes
| @m | media
| anim- | animation
| ai:(b|c|fe|fs|s|sa|sb) | align-items: baseline|center|flex-end|flex-start|stretch|space-around|space-between;
| fxd:(c|r) | flex-direction: column|row;
| jc:(c|fe|fs|sa|sb) | justify-content: baseline|flex-end|flex-start|space-around|space-between;
| trf:(r|sc|skx|sky|t) | transform: rotate|scale|skewX|skewY|translate;
| trs | transition
| trfo | transform-origin
|
|
Created By
Metadata
Favourited By
Comments
No comments yet. Add yours below!
Add a Comment
Related Cheat Sheets
More Cheat Sheets by deftcode