Zencoding cheatsheet, ayuda Memoria

Zen HTML ElementsBased on HTML 5 specification draft.

Root Elementhtml

<html></html>html:xml

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"></html>

html:4t<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html lang="en"><head>

<title></title><meta http-equiv="Content-Type" content="text/html;charset=UTF-8">

</head><body></body></html>

html:4s<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><html lang="en"><head>

<title></title><meta http-equiv="Content-Type" content="text/html;charset=UTF-8">


html:xt<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"><head>

<title></title><meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>


html:xs<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"><head>


</head>

<body></body></html>

html:xxs<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"><head>



html:5<!DOCTYPE HTML><html lang="en-EN"><head>

<title></title><meta charset="UTF-8">


Document Metadatahead

<head></head>title

<title></title>base

<base href="">link

<link>link:css

<link rel="stylesheet" type="text/css" href="style.css" media="all">

link:print<link rel="stylesheet" type="text/css" href="print.css" media="print">

link:favicon<link rel="shortcut icon" type="image/x-icon" href="favicon.ico">

link:touch<link rel="apple-touch-icon" href="favicon.png">

link:rss<link rel="alternate" type="application/rss+xml" title="RSS" href="rss.xml">

link:atom<link rel="alternate" type="application/atom+xml" title="Atom" href="atom.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=Win-1251">

meta:compat<meta http-equiv="X-UA-Compatible" content="IE=7">

style<style type="text/css"></style>

Scriptingscript

<script type="text/javascript"></script>script:src

<script type="text/javascript" src=""></script>noscript

<noscript></noscript>Sections

body<body></body>

section, sect<section></section>

nav<nav></nav>

article, art<article></article>

aside<aside></aside>

h1<h1></h1>

h2<h2></h2>

h3<h3></h3>

h4<h4></h4>

h5<h5></h5>

h6<h6></h6>

hgroup, hgr<hgroup></hgroup>

header, hdr<header></header>

footer, ftr<footer></footer>

address, adr<address></address>

div<div></div>

Grouping Contentp

<p></p>hr

<hr>br

<br>

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

http://code.google.com/p/zen-coding/


pre<pre></pre>

dialog, dlg<dialog></dialog>

blockquote, bq<blockquote></blockquote>

ol<ol></ol>

ol+<ol>

<li></li></ol>

ul<ul></ul>

ul+<ul>

<li></li></ul>

li<li></li>

dl<dl></dl>

dl+<dl>

<dt></dt><dd></dd>

</dl>dt

<dt></dt>dd

<dd></dd>Text-level Semantics

a<a href=""></a>

a:link<a href="http://"></a>

a:mail<a href="mailto:"></a>

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>

bdo<bdo dir=""></bdo>

bdo:r<bdo dir="rtl"></bdo>

bdo:l<bdo dir="ltr"></bdo>

ruby<ruby></ruby>

rt<rt></rt>

rp<rp></rp>

Editsins

<ins></ins>del

<del></del>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>

map+<map name="">

<area shape="" coords="" href="" alt=""></map>

area<area shape="" coords="" href="" alt="">

area:d<area shape="default" href="" alt="">

area:c<area shape="circle" coords="" href="" alt="">

area:r<area shape="rect" coords="" href="" alt="">

area:p<area shape="poly" coords="" href="" alt="">

Tabular Datatable

<table></table>table+

<table><tr>

<td></td></tr></table>

caption, cap<caption></caption>

colgroup, colg<colgroup></colgroup>

colgroup+, colg+<colgroup>

<col></colgroup>

col<col>

tbody<tbody></tbody>

thead<thead></thead>

tfoot<tfoot></tfoot>

tr<tr></tr>




tr+<tr>

<td></td></tr>

th<th></th>

td<td></td>

Formsform

<form action=""></form>form:get

<form action="" method="get"></form>form:post

<form action="" method="post"></form>fieldset, fset

<fieldset></fieldset>legend, leg

<legend></legend>label

<label for=""></label>input

<input type="">input:hidden, input:h

<input type="hidden" value="">input:text, input:t

<input type="text" value="" id="">input:search

<input type="search" value="" id="">input:email

<input type="email" value="" id="">input:url

<input type="url" value="" id="">input:password, input:p

<input type="password" value="" id="">input:datetime

<input type="datetime" value="" id="">input:datetime-local

<input type="datetime-local" value="" id="">input:date

<input type="date" value="" id="">input:month

<input type="month" value="" id="">input:week

<input type="week" value="" id="">input:time

<input type="time" value="" id="">input:number

<input type="number" value="" id="">input:range

<input type="range" value="" id="">input:color

<input type="color" value="" id="">

input:checkbox, input:c<input type="checkbox" id="">

input:radio, input:r<input type="radio" id="">

input:file, input:f<input type="file" id="">

input:submit, input:s<input type="submit" value="">

input:image, input:i<input type="image" src="" alt="">

input:reset<input type="reset" value="">

input:button, input:b<input type="button" value="">

button, btn<button></button>

select<select id=""></select>

select+<select id="">

<option value=""></option></select>

optgroup, optg<optgroup></optgroup>

optgroup+, optg+<optgroup>

<option></option></optgroup>

option, opt<option></option>

Interactive Elementsdatagrid, 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>menu:context, menu:c

<menu type="context"></menu>menu:toolbar, menu:t

<menu type="toolbar"></menu>

Commentscc:ie

cc:noie

Zen HTML Selectors

E#namediv#name

<div id="name"></div>E.name

div.name<div class="name"></div>

div.one.two<div class="one two"></div>

div#name.one.two<div id="name" class="one two"></div>

E>Ehead>link

<head><link/>

</head>table>tr>td

<table><tr>


ul#name>li.item<ul id="name">

<li class="item"></li></ul>

E+Ep+p

<p></p><p></p>

div#name>p.one+p.two<div id="name">

<p class="one"></p><p class="two"></p>

</div>Zen HTML Aliases

E*Np*3

<p></p><p></p><p></p>

ul#name>li.item*3<ul id="name">

<li class="item"></li><li class="item"></li><li class="item"></li>

</ul>




E*N$p.name-$*3

<p class="name-1"></p><p class="name-2"></p><p class="name-3"></p>

select>option#item-$*3<select>

<option id="item-1"></option><option id="item-2"></option><option id="item-3"></option>

</select>E+

ul+<ul>

<li></li></ul>

table+<table><tr>


dl+<dl>

<dt></dt><dd></dd>

</dl>Zen CSS properties

Based on CSS 3 draft specification Property 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:ftop:; ttop:auto; t:aright:; rright:auto; r:abottom:; bbottom:auto; b:aleft:; 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:ndisplay: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:aoverflow-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:; mbmargin-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




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:; bdbkborder-break:close; bdbk:cborder-collapse:; bdclborder-collapse:collapse; bdcl:cborder-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:nborder-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:url(); 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:; bdfborder-fit:clip; bdf:cborder-fit:repeat; bdf:rborder-fit:scale; bdf:scborder-fit:stretch; bdf:stborder-fit:overwrite; bdf:owborder-fit:overflow; bdf:ofborder-fit: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:wborder-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:; bdrwborder-right-style:; bdrsborder-right-style:none; bdrs:nborder-right-color:#000; bdrcborder-bottom:; bdbborder-bottom:none; bdb:nborder-bottom:1px solid #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-webkit-border-radius:; bdrz:w-moz-border-radius:; bdrz:mborder-top-right-radius:; bdtrrzborder-top-left-radius:; bdtlrzborder-bottom-right-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-attachment:; bgabackground-attachment:fixed; bga:fbackground-attachment:scroll; bga:sbackground-position:0 0; bgpbackground-position-x:; bgpxbackground-position-y:; bgpybackground-break:; bgbkbackground-break:bounding-box; bgbk:bbbackground-break:each-box; bgbk:ebbackground-break:continuous; bgbk:cbackground-clip:; bgcpbackground-clip:border-box; bgcp:bbbackground-clip:padding-box; bgcp:pbbackground-clip:content-box; bgcp:cbbackground-clip:no-clip; bgcp:ncbackground-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




Special content typestable-layout:; tbltable-layout:auto; tbl:atable-layout:fixed; tbl:fcaption-side:; cpscaption-side:top; cps:tcaption-side:bottom; cps:bempty-cells:; ecempty-cells:show; ec:sempty-cells:hide; ec:hlist-style:; lislist-style:none; lis:nlist-style-position:; lisplist-style-position:inside; lisp: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; list:lrlist-style-type:upper-roman; list:urlist-style-image:; lisilist-style-image:none; lisi:nquotes:; qquotes:none; q:nquotes:'\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:justify; ta:jtext-align-last:; taltext-align-last:auto; tal:atext-align-last:left; tal:ltext-align-last:center; tal:ctext-align-last:right; tal:rtext-decoration:; tdtext-decoration:none; td:ntext-decoration:overline; td:otext-decoration:line-through; td:ltext-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-height:auto; th:atext-height:font-size; th:ftext-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; tj:ictext-justify:distribute; tj:dtext-justify:kashida; tj:ktext-justify:tibetan; tj: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:utext-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:; whscwhite-space-collapse:normal; whsc:nwhite-space-collapse:keep-all; whsc:kwhite-space-collapse:loose; whsc:lwhite-space-collapse:break-strict; whsc:bswhite-space-collapse:break-all; whsc:baword-break:; wobword-break:normal; wob:nword-break:keep-all; wob:kword-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:; ffont: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:; fffont-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:; feffont-effect:none; fef:nfont-effect:engrave; fef:egfont-effect:emboss; fef:eb




font-effect:outline; fef:ofont-emphasize:; femfont-emphasize-position:; fempfont-emphasize-position:before; femp:bfont-emphasize-position: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:; fsmfont-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:msresize:; 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:hecursor: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 :.

Technology

Zencoding cheatsheet, ayuda Memoria