Scribd
Upload
70 views2 pages

Zen Coding

Uploaded by

szchmausser
Copyright
© Attribution Non-Commercial (BY-NC)
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
70 views2 pages

Zen Coding

Uploaded by

szchmausser
Copyright
© Attribution Non-Commercial (BY-NC)
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd

Zen Coding 0 .

6
[Link] .google .com/p/zen-coding

Selectors
div#name . . . . . . . . . . . . . <div id="name"></div> [Link] . . . . . . . . . . . . . . <div class="name"></div> [Link] . . . . . . . . . . . <div class="one two"></div> div#[Link] . . . . <div id="name" class="one two"></div> div>p . . . . . . . . . . . . . . . . . <div><p></p></div> p+p . . . . . . . . . . . . . . . . . . . <p></p><p></p> p*3 . . . . . . . . . . . . . . . . . . . . <p></p><p></p><p></p> [Link]-$*2 . . . . . . . . . . . <p class="name-1"></p><p class="name-2"></p> ul + . . . . . . . . . . . . . . . . . . . . . . . . . .<ul><li></li></ul> table + . . . . . . . . . . . . . . . . . . . . . .<table><tr><td></td></tr></table> dl + . . . . . . . . . . . . . . . . . . . . . . . . . .<dl><dt></dt><dd></dd></dl> [Link]|e 0 .6 . . . . . . . . . . . . . . . . . . .&lt;p class="title"&gt;&lt;/p&gt; p[title] 0 .6 . . . . . . . . . . . . . . . . . . . .<p title=""></p> td[colspan=2] 0 .6 . . . . . . . . . . . .<td colspan="2"></td> span[title="Hello" rel] 0 .6 . . . .<span title="Hello" rel=""></span>

Filters 0 .6
haml . . . HAML syntax filter html . . . . HTML syntax filter e . . . . . . . Escapes XML-unsafe characters: <, > and & c . . . . . . . Add comments around important tags fc . . . . . . . Add whitespace after CSS property name xsl . . . . . . This filter removes select attribute from <xsl:variable> and <xsl:with-param> tags if they have child nodes

html . . . . . . . . . . . . . . <html></html> :xmlxmlns :4tHTML4trans :4sHTML4strict :xtXHTMLtrans :xsXHTMLstrict :xxsXHTML1.1 :5

Document head & Metadata


head . . . . . . . . . . . . . <head></head> title . . . . . . . . . . . . . . <title></title> base . . . . . . . . . . . . . . <base href=""> link . . . . . . . . . . . . . . . <link> :csscss-link :printprintcss :favicon :touchtouch-icon :rss :atom meta . . . . . . . . . . . . . <meta> :utf :win :compatX-UA-Compatible style . . . . . . . . . . . . . <style type="text/css"></style> script . . . . . . . . . . . . . <script type="text/javascript"> :src noscript . . . . . . . . . . <noscript></noscript>

pre . . . . . . . . . . . . . . . <pre></pre> dialog (dlg) . . . . . . <dialog></dialog> blockquote (bq) . . <blockquote></blockquote> ol + . . . . . . . . . . . . . . . . <ol></ol> ul + . . . . . . . . . . . . . . . . <ul></ul> li . . . . . . . . . . . . . . . . <li></li> dl + . . . . . . . . . . . . . . . . <dl></dl> dt . . . . . . . . . . . . . . . . <dt></dt> dd . . . . . . . . . . . . . . . . <dd></dd>

ruby . . . . . . . . . . . . . . <ruby></ruby> rt . . . . . . . . . . . . . . . . <rt></rt> rp . . . . . . . . . . . . . . . . <rp></rp> bdo . . . . . . . . . . . . . . <bdo dir=""></bdo> :rrtl :lltr ins . . . . . . . . . . . . . . . <ins></ins> del . . . . . . . . . . . . . . . <del></del>

Forms
form . . . . . . . . . . . . . <form action=""></form> :get :post fieldset (fset) . . . . . <fieldset></fieldset> legend (leg) . . . . . . <legend></legend> label . . . . . . . . . . . . . <label for=""></label> input . . . . . . . . . . . . . <input type=""> :hidden (:h) :text (:t) :search :email :url :password (:p) :datetime :datetime-local :date :month :week :time :number :range :color :checkbox (:c) :radio (:r) :file (:f ) :submit (:s) :image (:i) :reset :button (:b) button (btn) . . . . . . <button></button> select + . . . . . . . . . . . <select id=""></select> optgroup (optg) + <optgroup></optgroup> option (opt) . . . . . . <option></option>

Embedded Content
figure (fig) . . . . . . . <figure></figure> img . . . . . . . . . . . . . . <img src="" alt=""> iframe (ifr) . . . . . . . <iframe src="" frameborder="0"></iframe> embed (emb) . . . . <embed src="" type=""> object (obj) . . . . . . <object data="" type=""></object> param . . . . . . . . . . . . <param name="" value=""> video . . . . . . . . . . . . . <video src=""></video> audio . . . . . . . . . . . . <audio src=""></audio> source (src) . . . . . . . <source> canvas . . . . . . . . . . . <canvas></canvas> map + . . . . . . . . . . . . . <map name=""></map> area . . . . . . . . . . . . . . <area shape="" coords="" href="" alt=""> :d default :c circle :r rect :p poly

Text-level Semantics
a . . . . . . . . . . . . . . . . <a href=""></a> :link http :mailmailto q . . . . . . . . . . . . . . . . <q></q> cite . . . . . . . . . . . . . . . <cite></cite> em . . . . . . . . . . . . . . . <em></em> strong (str) . . . . . . . <strong></strong> small . . . . . . . . . . . . . <small></small> mark . . . . . . . . . . . . . <mark></mark> dfn . . . . . . . . . . . . . . . <dfn></dfn> abbr . . . . . . . . . . . . . . <abbr title=""></abbr> acronym (acr) . . . . <acronym title=""></acronym> time . . . . . . . . . . . . . . <time></time> progress (prog) . . <progress></progress> meter . . . . . . . . . . . . <meter></meter> code . . . . . . . . . . . . . <code></code> var . . . . . . . . . . . . . . . <var></var> samp . . . . . . . . . . . . . <samp></samp> kbd . . . . . . . . . . . . . . <kbd></kbd> sub . . . . . . . . . . . . . . . <sub></sub> sup . . . . . . . . . . . . . . . <sup></sup> span . . . . . . . . . . . . . <span></span> i . . . . . . . . . . . . . . . . <i></i> b . . . . . . . . . . . . . . . . <b></b>

Sections
body . . . . . . . . . . . . . <body></body> section (sect) . . . . . <section></section> nav . . . . . . . . . . . . . . . <nav></nav> article (art) . . . . . . . <article></article> aside . . . . . . . . . . . . . <aside></aside> h1h6 . . . . . . . . . . . . <h1></h1> hgroup (hgr) . . . . . <hgroup></hgroup> header (hdr) . . . . . <header></header> footer (ftr) . . . . . . . <footer></footer> address (adr) . . . . . <address></address> div . . . . . . . . . . . . . . . <div></div>

Interactive Elements
datagrid (datag) . <datagrid></datagrid> datalist (datal) . . . <datalist></datalist> textarea (tarea) . . <textarea id="" cols="30" rows="10"></ textarea> keygen (kg) . . . . . . <keygen> output (out) . . . . . . <output></output> details (det) . . . . . . <details></details> command (cmd) . <command> bb . . . . . . . . . . . . . . . . <bb></bb> menu . . . . . . . . . . . . <menu></menu> :context (:c) :toolbar (:t)

Tables
table + . . . . . . . . . . . . <table></table> caption (cap) . . . . . <caption></caption> colgroup (colg) + . . <colgroup></colgroup> col . . . . . . . . . . . . . . . <col> tbody . . . . . . . . . . . . <tbody></tbody> thead . . . . . . . . . . . . <thead></thead> tfoot . . . . . . . . . . . . . <tfoot></tfoot> tr + . . . . . . . . . . . . . . . . <tr></tr> th . . . . . . . . . . . . . . . . <th></th> td . . . . . . . . . . . . . . . . <td></td>

Grouping Content
p . . . . . . . . . . . . . . . . <p></p> hr . . . . . . . . . . . . . . . . <hr> br . . . . . . . . . . . . . . . . <br>

Conditional Comments
cc:ie . . . . . . . . . . . . . . <!--[if IE]><![endif]--> cc:noie . . . . . . . . . . . <!--[if !IE]><!--><!--<![endif]-->

@import url() . . . . . . . . .@i @media print { } . . . . . . . .@m @font-face { ... } . . . . . . . .@f !important . . . . . . . . . . . .! expression() . . . . . . . . . . .exp

border-top-width . . . . . . .bdtw border-top-style . . . . . . .bdts :nnone border-top-color:#000 . . .bdtc border-right . . . . . . . . . .bdr + :nnone border-right-width . . . . .bdrw border-right-style . . . . . .bdrs :nnone Positioning border-right-color:#000 . . .bdrc position . . . . . . . . . . . . . .pos :sstatic :aabsolute border-bottom . . . . . . . . .bdb + :nnone :rrelative :ffixed border-bottom-width . . . .bdbw top . . . . . . . . . . . . . . . . .t :a auto border-bottom-style . . . .bdbs :nnone right . . . . . . . . . . . . . . . .r :a auto border-bottom-color:#000 .bdbc bottom . . . . . . . . . . . . . .b :a auto border-left . . . . . . . . . . . .bdl + :nnone left . . . . . . . . . . . . . . . . .l :a auto border-left-width . . . . . . .bdlw z-index . . . . . . . . . . . . . .z :a auto border-left-style . . . . . . .bdls :nnone Box behavior & properties border-left-color:#000 . . .bdlc border-radius . . . . . . . . . .bdrz :w-webkit :m-moz float . . . . . . . . . . . . . . . .fl :nnone :lleft :rright Color & appearance border-top-right-radius . .bdtrrz clear . . . . . . . . . . . . . . . .cl :nnone :lleft :rright outline . . . . . . . . . . . . . .o + :nnone border-top-left-radius . . .bdtlrz :bboth outline-offset . . . . . . . . .oo border-bottom-right-radius .bdbrrz display . . . . . . . . . . . . . .d :nnone :bblock outline-width . . . . . . . . .ow border-bottom-left-radius .bdblrz :iinline :ibinline-block outline-style . . . . . . . . . .os background . . . . . . . . . . .bg + :nnone :ie :mib-moz-inline-box outline-color:#000 . . . . . .oc :iinvert background-color:#fff . . . .bgc :ttransp. :mis-moz-inline-stack border . . . . . . . . . . . . . . .bd + :nnone background-image:url() . .bgi :nnone :lilist-item :rirun-in border-break . . . . . . . . . .bdbk :cclose background-repeat . . . . . .bgr :rrepeat :xrepeat-x :cpcompact :tbtable border-collapse . . . . . . . .bdcl :ccollapse :sseparate :yrepeat-y :nno-repeat :itbinline-table border-color:#000 . . . . . .bdc background-attachment . .bga :ffixed :sscroll :tbcptable-caption border-image . . . . . . . . .bdi + :nnone :w +-webkit background-position:0 . . .bgp :tbcltable-column :m +-moz background-position-x . . .bgpx & bgpy :tbclgtable-column-group border-top-image . . . . . .bdti :nnone background-break . . . . . .bgbk :bbbounding-box :tbhgtable-header-group border-right-image . . . . .bdri :nnone :ebeach-box :ccontinuous :tbfgtable-footer-group border-bottom-image . . .bdbi :nnone background-clip . . . . . . . .bgcp :bbborder-box :tbrtable-row border-left-image . . . . . .bdli :nnone :pbpadding-box :tbrgtable-row-group border-corner-image . . . .bdci :nnone :ccontinue :cbcontent-box :ncno-clip :tbctable-cell border-top-left-image . . .bdtli :nnone :ccontinue background-origin . . . . . .bgo :bbborder-box visibility . . . . . . . . . . . . .v :vvisible :hhidden border-top-right-image . .bdtri :nnone :ccontinue :pbpadding-box :ccollapse border-bottom-right-image .bdbri :nnone :ccontinue :cbcontent-box overflow . . . . . . . . . . . . .ov :vvisible :hhidden border-bottom-left-image .bdbli :nnone :ccontinue background-size . . . . . . . .bgz :aauto :ctcontain :sscroll :aauto border-fit . . . . . . . . . . . .bdf :cclip :rrepeat :cvcover overflow-x . . . . . . . . . . . .ovx & ovy :scscale :ststretch color:#000 . . . . . . . . . . . .c :vvisible :hhidden :owoverwrite :sscroll :aauto Special content types :ofoverflow :spspace overflow-style . . . . . . . . .ovs :aauto :sscrollbar border-length . . . . . . . . .bdlt :aauto table-layout . . . . . . . . . .tbl :aauto :ffixed :ppanner :mmove border-spacing . . . . . . . .bdsp caption-side . . . . . . . . . .cps :ttop :bbottom :mqmarquee border-style . . . . . . . . . . .bds :nnone :hhidden empty-cells . . . . . . . . . . .ec :sshow :hhide zoom:1 . . . . . . . . . . . . . .zoo :dtdotted :dsdashed list-style . . . . . . . . . . . . .lis :nnone clip . . . . . . . . . . . . . . . . .cp :aauto :rrect :ssolid :dbdouble list-style-position . . . . . . .lisp :iinside :ooutside box-sizing . . . . . . . . . . . .bxz :cbcontent-box :dtdsdot-dash list-style-type . . . . . . . . .list :nnone :ddisc :bbborder-box :dtdtdsdot-dot-dash :ccircle :ssquare box-shadow . . . . . . . . . . .bxsh + :n none :wwave :ggroove :rridge :dcdecimal :w +-webkit :m +-moz :iinset :ooutset :dclzdecimal-leading-zero Sizing border-width . . . . . . . . . .bdw :lrlower-roman border-top . . . . . . . . . . . .bdt + :nnone :urupper-roman margin . . . . . . . . . . . . . .m :aauto :0 4

margin-top . . . . . . . . . . .mt :aauto margin-right . . . . . . . . . .mr :aauto margin-bottom . . . . . . . .mb :aauto margin-left . . . . . . . . . . .ml :aauto padding . . . . . . . . . . . . .p :0 4 padding-top . . . . . . . . . .pt padding-right . . . . . . . . .pr padding-bottom . . . . . . .pb padding-left . . . . . . . . . .pl width . . . . . . . . . . . . . . .w :aauto height . . . . . . . . . . . . . . .h :aauto max-width . . . . . . . . . . .maw :nnone max-height . . . . . . . . . . .mah :nnone min-width . . . . . . . . . . . .miw min-height . . . . . . . . . . .mih

list-style-image . . . . . . . .lisi :nnone quotes . . . . . . . . . . . . . . .q :nnone :ru :en content . . . . . . . . . . . . . .ct :nnormal :oqopenquote :noqno-openquote :cqclose-quote :ncqno-close-quote :aattr() :ccounter() :cscounters() counter-increment . . . . . .coi counter-reset . . . . . . . . . .cor

Text

vertical-align . . . . . . . . . .va :supsuper :ttop :tttext-top :mmiddle :blbaseline :bbottom :tbtext-bottom :subsub text-align . . . . . . . . . . . .ta :lleft :ccenter :rright :jjustify text-align-last . . . . . . . . .tal :aauto :lleft :ccenter :rright text-decoration . . . . . . . .td :nnone :ooverline :lline-through :uunderline text-emphasis . . . . . . . . .te :nnone :acaccent :dtdot :ccircle :dsdisc :bbefore :aafter text-height . . . . . . . . . . .th :aauto :ffont-size :ttext-size :mmax-size text-indent . . . . . . . . . . .ti :--9999px text-justify . . . . . . . . . . .tj :aauto :iinter-word :iiinter-ideograph :icinterVisual properties cluster :ddistribute :kkashida :ttibetan opacity . . . . . . . . . . . . . .op :ie :ms text-outline . . . . . . . . . . .to + :nnone resize . . . . . . . . . . . . . . .rz :nnone :bboth :hhorizontal :vvertical text-replace . . . . . . . . . . .tr :nnone text-transform . . . . . . . . .tt :nnone :uuppercase cursor . . . . . . . . . . . . . . .cur :aauto :ddefault :ccrosshair :hahand :ccapitalize :llowercase text-wrap . . . . . . . . . . . .tw :nnormal :nonone :hehelp :mmove :uunrestricted :ssuppress :ppointer :ttext text-shadow . . . . . . . . . .tsh + :nnone Print line-height . . . . . . . . . . .lh page-break-before . . . . . .pgbb :aauto white-space . . . . . . . . . . .whs :nnormal :ppre :awalways :lleft :rright :nwnowrap :pwprepage-break-inside . . . . . .pgbi :aauto :avavoid wrap :plpre-line page-break-after . . . . . . .pgba :aauto white-space-collapse . . . .whsc :nnormal :awalways :lleft :rright :kkeep-all :lloose orphans . . . . . . . . . . . . . .orp :bsbreak-strict widows . . . . . . . . . . . . . .wid :babreak-all word-break . . . . . . . . . . .wob :nnormal :kkeep-all :lloose :bsbreak-strict :babreak-all word-spacing . . . . . . . . . .wos Cheatsheet by Alexander Shabunevich [aether .ru]

word-wrap . . . . . . . . . . .wow :nnormal :nonone :uunrestricted :ssuppress letter-spacing . . . . . . . . .lts font . . . . . . . . . . . . . . . . .f + font-weight . . . . . . . . . . .fw :nnormal :bbold :brbolder :lrlighter font-style . . . . . . . . . . . .fs :nnormal :iitalic :ooblique font-variant . . . . . . . . . . .fv :nnormal :scsmall-caps font-size . . . . . . . . . . . . .fz font-size-adjust . . . . . . . .fza :nnone font-family . . . . . . . . . . .ff :sserif :sssans-serif :ccursive :mmonospace font-effect . . . . . . . . . . . .fef :nnone :egengrave :ebemboss :ooutline font-emphasize . . . . . . . .fem font-emphasize-position .femp :bbefore :aafter font-emphasize-style . . . .fems :nnone :acaccent :dtdot :ccircle :dsdisc font-smooth . . . . . . . . . .fsm :aauto :nnever :awalways font-stretch . . . . . . . . . . .fst :nnormal :ucultracondensed :ecextracondensed :ccondensed :sesemi-expanded :eexpanded :eeextraexpanded :ueultraexpanded

You might also like