zencodingcheatsheet.pdf

7/29/2019 ZenCodingCheatSheet.pdf

1/7

Zen HTML ElementsBased on HTML 5 specification draft.

Root Elementhtml

html:xml

html:4t

html:4s

html:xt

html:xs

html:xxs

html:5

Document Metadatahead

title

base

link

link:css

link:print

link:favicon

link:touch

link:rss

link:atom

meta

meta:utf

meta:win

meta:compat

style

Scriptingscript

script:src

noscript Sections

body

section, sect

nav

article, art

aside

h1

h2

h3

h4

h5

h6

hgroup, hgr

header, hdr

footer, ftr

address, adr

div

Grouping Content

p

hr

br

http://code.google.com/p/zen-coding/ 1 GNU General Public License v3
http://code.google.com/p/zen-coding/http://code.google.com/p/zen-coding/http://code.google.com/p/zen-coding/http://code.google.com/p/zen-coding/


2/7

pre

dialog, dlg

blockquote, bq

ol

ol+

ul ul+

li

dl

dl+

dt

dd

Text-level Semantics

a

a:link

a:mail

q

cite

em

strong, str

small

mark

dfn

abbr

acronym, acr

time

progress, prog

meter

code

var

samp kbd

sub

sup

span

i

b

bdo

bdo:r

bdo:l

ruby

rt

rp

Editsins

del

Embedded Content

figure, fig

img

iframe, ifr

embed, emb

object, obj

param

video

audio

source, src

canvas

map

map+

area

area:d

area:c

area:r

area:p

Tabular Data

table

table+

caption, cap

colgroup, colg

colgroup+, colg+

col

tbody

thead

tfoot

tr



3/7

tr+

th

td

Formsform

form:get

form:post

fieldset, fset

legend, leg

label

input

input:hidden, input:h

input:text, input:t

input:search

input:email

input:url

input:password, input:p

input:datetime

input:datetime-local

input:date

input:month

input:week

input:time

input:number

input:range

input:color

input:checkbox, input:c

input:radio, input:r

input:file, input:f

input:submit, input:s

input:image, input:i

input:reset

input:button, input:bbutton, btn

select

select+

optgroup, optg

optgroup+, optg+

option, opt

Interactive Elementsdatagrid, datag

datalist, datal

textarea, tarea

keygen, kg

output, out

details, det

command, cmd

bb

menu

menu:context, menu:c

menu:toolbar, menu:t

Commentscc:ie

cc:noie

Zen HTML SelectorsE#name

div#name

E.namediv.name

div.one.two

div#name.one.two

E>E

head>link

table>tr>td

ul#name>li.item

E+E

p+p

div#name>p.one+p.two

Zen HTML AliasesE*N

p*3

ul#name>li.item*3



4/7

E*N$p.name-$*3

select>option#item-$*3

E+

ul+

table+

dl+

Zen CSS propertiesBased on CSS 3 draft specificationProperty Alias

Special Rules@import url(); @i@media print { @m}@font-face { @f

font-family:;src:url();

}!important !expression () exp

Properties GroupsSorting Methods

Positioning

Box behavior and properties

Sizing

Color appearance

Special content types

Text

Visual properties

Print

Positioningposition:; posposition:static; pos:sposition:absolute; pos:aposition:relative; pos:rposition:fixed; pos:f top:; ttop:auto; t:aright:; rright:auto; r:abottom:; bbottom:auto; b:a

left:; lleft:auto; l:az-index:; zz-index:auto; z:a

Box behavior and propertiesfloat:; flfloat:none; fl:nfloat:left; fl:lfloat:right; fl:rclear:; clclear:none; cl:nclear:left; cl:lclear:right; cl:rclear:both; cl:bdisplay:; ddisplay:none; d:n

display:block; d:bdisplay:inline; d:idisplay:inline-block; d:ibdisplay:-moz-inline-box:; d:mibdisplay:-moz-inline-stack:; d:misdisplay:list-item; d:lidisplay:run-in; d:ridisplay:compact; d:cpdisplay:table; d:tbdisplay:inline-table; d:itbdisplay:table-caption; d:tbcpdisplay:table-column; d:tbcldisplay:table-column-group; d:tbclgdisplay:table-header-group; d:tbhgdisplay:table-footer-group ; d:tbfgdisplay:table-row; d:tbrdisplay:table-row-group; d:tbrgdisplay:table-cell; d:tbcvisibility:; vvisibility:visible; v:vvisibility:hidden; v:hvisibility:collapse; v:coverflow:; ovoverflow:visible; ov:voverflow:hidden; ov:h

overflow:scroll; ov:soverflow:auto; ov:aoverflow-x:; ovxoverflow-x:visible; ovx:voverflow-x:hidden; ovx:hoverflow-x:scroll; ovx:soverflow-x:auto; ovx:aoverflow-y:; ovyoverflow-y:visible; ovy:voverflow-y:hidden; ovy:hoverflow-y:scroll; ovy:soverflow-y:auto; ovy:a

overflow-style:; ovsoverflow-style:auto; ovs:aoverflow-style:scrollbar; ovs:soverflow-style:panner; ovs:poverflow-style:move; ovs:moverflow-style:marquee; ovs:mqzoom:1; zooclip:; cpclip:auto; cp:aclip:rect(0 0 0 0); cp:rbox-sizing:; bxzbox-sizing:content-box; bxz:cbbox-sizing:border-box; bxz:bbbox-shadow:; bxshbox-shadow:none; bxsh:nbox-shadow:0 0 0 #000; bxsh+

-webkit-box-shadow:; bxsh:w-webkit-box-shadow:0 0 0 #000; bxsh:w+-moz-box-shadow:; bxsh:m-moz-box-shadow:0 0 0 0 #000; bxsh:m+

Sizingmargin:; mmargin:auto; m:amargin:0; m:0margin:0 0; m:2margin:0 0 0; m:3margin:0 0 0 0; m:4margin-top:; mtmargin-top:auto; mt:amargin-right:; mrmargin-right:auto; mr:amargin-bottom:; mb

margin-bottom:auto; mb:amargin-left:; mlmargin-left:auto; ml:apadding:; ppadding:0; p:0padding:0 0; p:2padding:0 0 0; p:3padding:0 0 0 0; p:4padding-top:; ptpadding-right:; pr



5/7

padding-bottom:; pbpadding-left:; plwidth:; wwidth:auto; w:aheight:; hheight:auto; h:amax-width:; mawmax-width:none; maw:nmax-height:; mahmax-height:none; mah:nmin-width:; miwmin-height:; mih

Color appearanceoutline:; ooutline:none; o:noutline:1px solid #000; o+outline-offset:; oooutline-width:; owoutline-style:; osoutline-color:#000; ocoutline-color:invert; oc:iborder:; bdborder:none; bd:nborder:1px solid #000; bd+border-break:; bdbk border-break:close; bdbk:cborder-col lapse: ; bdclborder-collapse:collapse; bdcl:c

border-collapse:separate; bdcl:sborder-color:#000; bdcborder-image:url(); bdiborder-image:none; bdi:n-webkit-border-image:; bdi:w-webkit-border-image:url() 0 0 0 0 stretch stretch;

bdi:w+-moz-border-image:; bdi:m-moz-border-image:url() 0 0 0 0 stretch stretch;

bdi:m+border-top-image:url(); bdtiborder-top-image:none; bdti:nborder-right-image:url(); bdriborder-right-image:none; bdri:nborder-bottom-image:url(); bdbiborder-bottom-image:none; bdbi:n

border-left-image:url(); bdliborder-left-image:none; bdli:nborder-corner-image:url(); bdciborder-corner-image:none; bdci:nborder-corner- image:continue; bdci:cborder-top- left-image:url(); bdtliborder-top- left-image:none; bdtli:nborder-top-left-image:continue; bdtli :cborder-top-right -image:ur l(); bdtriborder-top-right -image:none; bdtri :n

border-top-right-image:continue; bdtri:cborder-bottom-right-image:url(); bdbriborder-bottom-right-image:none; bdbri:nborder-bottom-right-image:continue; bdbri:cborder-bottom-left-image:url(); bdbliborder-bottom-left-image:none; bdbli :nborder-bottom-left-image:continue; bdbli:cborder-fit:; bdf border-fit:clip; bdf:cborder-fit:repeat; bdf:rborder-fi t:scale; bdf:scborder-fit:stretch; bdf:st

border-fit:overwrite; bdf:owborder-fit:overflow; bdf:of border-fi t:space; bdf:spborder-length:; bdltborder-length:auto; bdlt:aborder-spacing:; bdspborder-style:; bdsborder-style:none; bds:nborder-style:hidden; bds:hborder-style:dotted; bds:dtborder-style:dashed; bds:dsborder-style:solid; bds:sborder-style:double; bds:dbborder-style:dot-dash; bds:dtdsborder- style:dot-dot-dash; bds:dtdtdsborder-style:wave; bds:w

border-style:groove; bds:gborder-style:ridge; bds:rborder-style:inset; bds:iborder-style:outset; bds:oborder-width:; bdwborder-top:; bdtborder-top:none; bdt:nborder-top:1px solid #000; bdt+border-top-width:; bdtwborder-top-style:; bdtsborder-top-style:none; bdts:nborder-top-color:#000; bdtcborder-right:; bdrborder-right:none; bdr:nborder- right:1px solid #000; bdr+border-right-width:; bdrw

border-right-style:; bdrsborder-right-style:none; bdrs:nborder-right-color:#000; bdrcborder-bottom:; bdbborder-bottom:none; bdb:nborder-bottom:1px sol id #000; bdb+border-bottom-width: ; bdbwborder-bottom-style:; bdbsborder-bottom-style:none; bdbs:nborder-bottom-color:#000; bdbc

border-left:; bdlborder -left :none; bdl:nborder-left:1px solid #000; bdl+border-left-width:; bdlwborder -left -style:; bdlsborder -left -style:none; bdls:nborder -left -color :#000; bdlcborder-radius:; bdrz-webki t-border-radius: ; bdrz :w-moz-border-radius:; bdrz:mborder-top-right-radius:; bdtrrzborder-top-left-radius:; bdtlrz

border -bottom-r ight-radius: ; bdbrrzborder-bottom-left-radius:; bdblrzbackground:; bgbackground:none; bg:nbackground:#FFF url() 0 0 no-repeat; bg+filter:progid:DXImageTransform.Microsoft.AlphaImage

Loader(src='',sizingMethod='crop');bg:ie

background-color:#FFF; bgcbackground-color :transparent; bgc:tbackground-image:url () ; bgibackground-image:none; bgi:nbackground-repeat:; bgrbackground-repeat:repeat; bgr:rbackground-repeat:repeat-x; bgr:xbackground-repeat:repeat-y; bgr:ybackground-repeat :no-repeat ; bgr:nbackground-at tachment :; bgabackground-at tachment :fixed; bga:f background-at tachment :scroll ; bga:sbackground-position:0 0; bgpbackground-position-x: ; bgpxbackground-position-y: ; bgpybackground-break:; bgbk background-break:bounding-box; bgbk:bbbackground-break:each-box; bgbk:ebbackground-break:cont inuous; bgbk:cbackground-cl ip:; bgcpbackground-clip:border-box; bgcp:bbbackground-cl ip:padding-box; bgcp:pbbackground-cl ip:content -box; bgcp:cbbackground-clip:no-clip; bgcp:nc

background-origin:; bgobackground-origin:padding-box; bgo:pbbackground-origin:border-box; bgo:bbbackground-origin:content-box; bgo:cbbackground-size:; bgzbackground-size:auto; bgz:abackground-size:contain; bgz:ctbackground-size:cover; bgz:cvcolor:#000; c



6/7

Special content typestable-layout:; tbltable-layout:auto; tbl:atable-layout:fixed; tbl:f caption-side:; cpscaption-s ide:top; cps:tcaption-side:bottom; cps:bempty-cells:; ecempty-cells :show; ec:sempty-cells:hide; ec:hlist-style:; lislist-style:none; lis:n

l ist-style-position:; l ispl ist-style-position:inside; l isp:ilist-style-position:outside; lisp:olist-style-type:; listlist-style-type:none; list:nlist-style-type:disc; list:dlist-style-type:circle; list:clist-style-type:square; list:slist-style-type:decimal; list:dclist-style-type:decimal-leading-zero; list:dclzlist-style-type:lower-roman; li st :lrlist-style-type:upper-roman; li st :urlist-style-image:; lisilist-style-image:none; lisi:nquotes:; qquotes:none; q:n

quotes:'\00AB' '\00BB' '\201E' '\201C'; q:ruquotes:'\201C' '\201D' '\2018' '\2019'; q:encontent:; ctcontent:normal; ct:ncontent:open-quote; ct:oqcontent:no-open-quote; ct:noqcontent:close-quote; ct:cqcontent :no-close-quote; ct :ncqcontent:attr(); ct:acontent:counter(); ct:ccontent:counters(); ct:cscounter-increment:; coicounter-reset:; cor

Textvertical-align:; vavertical-align:super; va:supvertical-align:top; va:tvertical-align:text-top; va:ttvertical-align:middle; va:mvertical-align:baseline; va:blvertical-align:bottom; va:bvertical-align:text-bottom; va:tbvertical-align:sub; va:subtext-align:; tatext-align:left; ta:l

text-align:center; ta:ctext-align:right; ta:rtext-align:just ify; ta:jtext-align-last:; taltext-align-last:auto; tal:atext-al ign-last:left; tal :ltext-align-last:center; tal:ctext-align-last:right; tal:rtext-decoration:; tdtext-decoration:none; td:ntext-decoration:overl ine; td:otext-decoration:line-through; td:l

text-decoration:underline; td:utext-emphasis:; tetext-emphasis:none; te:ntext-emphasis:accent; te :actext-emphasis:dot; te:dttext-emphasis:circle; te:ctext-emphasis:disc; te:dstext-emphasis:before; te :btext-emphasis:after; te:atext-height:; thtext-he ight:auto; th:atext-height:font-size; th:f text-height:text-size; th:ttext-height:max-size; th:mtext-indent:; titext-indent:-9999px; ti:-

text-justify:; tjtext-justify:auto; tj:atext-justify:inter-word; tj:iwtext-justify:inter-ideograph; tj:iitext-justify:inter-cluster; t j:ictext-justify:distribute; tj:dtext-justify:kashida; tj:k text-justify:tibetan; t j:ttext-outline:; totext-outline:none; to:ntext-outline:0 0 #000; to+text-replace:; trtext-replace:none; tr:ntext-transform:; tttext-transform:none; tt:ntext-transform:uppercase; tt:u

text-transform:capitalize; tt:ctext-transform:lowercase; tt:ltext-wrap:; twtext-wrap:normal; tw:ntext-wrap:none; tw:notext-wrap:unrestricted; tw:utext-wrap:suppress; tw:stext-shadow:; tshtext-shadow:none; tsh:ntext-shadow:0 0 0 #000; tsh+

line-height:; lhwhite-space:; whswhite-space:normal; whs:nwhite-space:pre; whs:pwhite-space:nowrap; whs:nwwhite-space:pre-wrap; whs:pwwhite-space:pre-line; whs:plwhite-space-collapse:; whscwhi te-space-co llapse:normal; whsc:nwhi te-space-co llapse:keep-al l; whsc:k white-space-collapse:loose; whsc:lwhite-space-collapse:break-strict; whsc:bs

white-space-collapse:break-al l; whsc:baword-break:; wobword-break:normal; wob:nword-break:keep-all; wob:k word-break:loose; wob:lword-break:break-strict; wob:bsword-break:break-all; wob:baword-spacing:; wosword-wrap:; wowword-wrap:normal; wow:nword-wrap:none; wow:noword-wrap:unrestricted; wow:uword-wrap:suppress; wow:sletter-spacing:; ltsfont:; f font:1em Arial,sans-serif; f+

font-weight:; fwfont-weight:normal; fw:nfont-weight:bold; fw:bfont-weight:bolder; fw:brfont-weight:lighter; fw:lrfont-style:; fsfont-style:normal; fs:nfont-style:italic; fs:ifont-style:oblique; fs:ofont-variant:; fvfont-variant:normal; fv:nfont-variant:small-caps; fv:scfont-size:; fzfont-size-adjust:; fzafont-size-adjust:none; fza:nfont-family:; ff

font-family:Georgia,'Times New Roman',serif; ff:sfont-family:Helvetica,Arial,sans-serif; ff:ssfont-family:'Monotype Corsiva','Comic Sans MS',cursive;

ff:cfont-family:Capitals,Impact,fantasy; ff:ffont-family:Monaco,'Courier New',monospace; ff:mfont-effect:; fef font-effect:none; fef:nfont-effect:engrave; fef:egfont-effect:emboss; fef:eb



7/7

font-effect:outline; fef:ofont-emphasize:; femfont-emphasize-position:; fempfont-emphasize-position:before; femp:bfont-emphasize-posit ion:after; femp:afont-emphasize-style:; femsfont-emphasize-style:none ; fems:nfont-emphasize-style:accent; fems:acfont-emphasize-style:dot; fems:dtfont-emphasize-style:circle; fems:cfont-emphasize-style:disc; fems:dsfont-smooth:; fsm

font-smooth:auto; fsm:afont-smooth:never; fsm:nfont-smooth:always; fsm:awfont-stretch:; fstfont-stretch:normal; fst:nfont-stretch:ultra-condensed; fst:ucfont-stretch:extra-condensed; fst:ecfont-stretch:condensed; fst:cfont-stretch:semi -condensed; fst:scfont-stretch:semi-expanded; fst:sefont-stretch:expanded; fst:efont-stretch:extra-expanded; fst:eefont-stretch:ultra-expanded; fst:ue

Visual propertiesopacity:; opfilter:progid:DXImageTransform.Microsoft.Alpha

(Opacity=100); op:ie-ms-filter:'progid:DXImageTransform.Microsoft.Alpha

(Opacity=100)';op:ms

resize:; rzresize:none; rz:nresize:both; rz:bresize:horizontal; rz:hresize:vertical; rz:vcursor:; curcursor:auto; cur:acursor:default; cur:dcursor:crosshair; cur:ccursor:hand; cur:hacursor:help; cur:he

cursor:move; cur:mcursor:pointer; cur:pcursor:text; cur:t

Printpage-break-before:; pgbbpage-break-before:auto; pgbb:apage-break-before:always; pgbb:awpage-break-before:left ; pgbb: lpage-break-before:right; pgbb:rpage-break-inside:; pgbi

page-break-inside:auto ; pgbi :apage-break-inside:avoid; pgbi:avpage-break-after:; pgbapage-break-after:auto; pgba:apage-break-after:always; pgba:awpage-break-after:left; pgba:lpage-break-after:right ; pgba:rorphans:; orpwidows:; wid

.: PDF version by Shayanlinux Compiled in OpenOffice.org Writer :.


zencodingcheatsheet.pdf

Documents