zen coding de 一些快捷功能

zen coding de 一些快捷功能
这是一个zen coding 的一些快捷功能,貌似是别人修改过的.


先说几个快捷键:(我是用DW的,所以一下都是按DW来说的,请用vim、TextMate、Sublime Text 2等的不要鄙视。)快捷键部分是自己凭记忆写的,在DW菜单栏“命令”-“zen coding”下可找到详细的快捷键


zen coding的详细的安装及使用说明可去: http://www.qianduan.net/zen-coding-a-new-way-to-write-html-code.html


“ctrl+,”是其默认的展现快捷键。DW中这个键被别的使用了,要去快捷键里修改下。


“ctrl+\”是把所选内容去掉空格放置到一行上,(mini功能)


“ctrl+/”是注释所选内容,再次按下取消注释


“ctrl+h”是在所选内容外加标签;


“alt+-”是去掉父级内容,但子集保留;


“ctrl+k”选择一行;


更多的像:“alt+[”“alt+]”“alt+\”等可以去看下效果,菜单栏“命令”-“zen coding”下可找到详细的快捷键。


下面是具体的简写内容:


转自:http://www.cnblogs.com/jikey/archive/2010/01/29/1659556.html


下面的解释上部是简写,下部是展现后


ppa
position:absolute;ppr
position:relative;还有类似的:
fl
float:left;
fr
float:right;
cb
clear:both;
db
display:block;
di
display:inline;
dib
display:inline-block;
oh
overflow:hidden;
其它css类:


m
margin:;
mt
margin-top:;
mr
margin-right:;
ml
margin-left:;
mb
margin-bottom:;
p
padding:;
pt,pr,pb,pl同margin
bg
background:url() 0 0 no-repeat;
bg:n
background:none;
bg:x
background:url() 0 0 repeat-x;
bg:y
background:url() 0 0 repeat-y;
bg:ie
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=’x.png’);
b
border:1px solid #000;
bd:n
border:none;
bdc
border-color:#000;
c
color:#000;
d
display:block;
f
font-size:12px;
h:;
height:;
w
width:;
d:i
display:inline;
d:b
display:block;
fl
float:left;
fr
float:right;
cl
clear:both;
c:l
clear:left;
c:r
clear:right;
c:n
clear:none;
t
top:;
bt
bottom:;
r
right:;
l
left:;
r
right:;
z
z-index:;
v
visibility:hidden;
o:h
overflow:hidden;
zoo
zoom:1;
m:a
margin:0 auto;
ol
outline:;
q
quotes:;
tc
text-align:center;
tl
text-align:left;
tr
text-align:right;
td
text-decoration:none;
te
text-emphasis:;
to:n
text-outline:none;
whs:n
white-space:normal;
whs:nw
white-space:nowrap;
wob:k
word-break:keep-all;
fz
font-size:12px;
fw
font-weight:bold;
ff
font-family:;
op
opacity:;
c:p
cursor:pointer;
 


 


 


 


html类:


综合类:
div#a+div#b+div.c-$*5+li*10
<div id=”a”></div>
<div id=”b”></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
div#width>p#a>p#a>p*10>p#a


<div id=”width”>
<p id=”a”>
<p id=”a”>
<p>
<p id=”a”></p>
</p>
<p>
<p id=”a”></p>
</p>
</p>
</p>
</div>
ul#a>li.c-$*5+li.0>a.title


<ul id=”a”>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li><a href=”"></a></li>
</ul>
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″ />
</head>
<body>
aaa
</body>
</html>
cc:ie6
<!–[if lte IE 6]>
aa
<![endif]–>
cc:ie
<!–[if IE]><![endif]–>
cc:noie
<!–[if !IE]><!–>
aa
<!–<![endif]–>link:css
<link rel=”stylesheet” type=”text/css” href=”style.css” media=”all” />
a:mail
<a href=”mailto:jikeytang
@163.com”></a>
meta:utf
<meta http-equiv=”Content-Type” content=”text/html;charset=UTF-8″ />
link
<link rel=”stylesheet” href=”" />
style
<style type=”text/css”>body{}</style>
script
<script type=”text/javascript”>//some coding</script>
script:src
<script type=”text/javascript” src=”/scripts/zen_settings.js”></script>
img
<img src=”/12″ alt=”" />
iframe
<iframe src=”/12.html” frameborder=”0″></iframe>
embed
<embed src=”" type=”" />
object
<object data=”" type=”"></object>
param
<param name=”" value=”" />
map
<map name=”"></map>
area
<area shape=”" coords=”" href=”" alt=”" />
form
<form action=”"></form>
form:get
<form action=”" method=”get”></form>
form:post
<form action=”" method=”post”></form>
label
<label for=”"></label>
input
<input type=”" />
input:hidden
<input type=”hidden” name=”" />
input:h
<input type=”hidden” name=”" />
input:text
<input type=”text” name=”" id=”" />
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:p
<input type=”password” name=”" id=”" />
input:date
<input type=”date” name=”" id=”" />
input:datetime
<input type=”datetime” name=”" id=”" />
input:month
<input type=”month”<
;/span> name=”" id=”" />
input:week
<input type=”week” name=”" id=”" />
input:time
<input type=”time” name=”" id=”" />
input:number
<input type=”number” name=”" id=”" />
input:color
<input type=”color” name=”" id=”" />
input:checkbox
<input type=”checkbox” name=”" id=”" />
input:c
<input type=”checkbox” name=”" id=”" />
input:radio
<input type=”radio” name=”" id=”" />
input:r
<input type=”radio” name=”" id=”" />
input:f
<input type=”file” name=”" id=”" />
input:s
<input type=”submit” value=”" />
input:i
<input type=”image” src=”" alt=”" />
input:reset
<input type=”reset” value=”" />
input:button
<input type=”button” value=”" />
input:b
<input type=”button” value=”" />
select
<select name=”" id=”"></select>
option
<option value=”"></option>
textarea
<textarea name=”" id=”" cols=”30″ rows=”10″></textarea>
menu:c
<menu type=”context”></menu>
bq
<blockquote></blockquote>
cap
<caption></caption>
optg
<optgroup></optgroup>
opt
<option></option>
fst
<fieldset></fieldset>
leg
<legend></legend>
sect
<section></section>
tarea
<textarea></textarea>
hdr
<header></header>
<!– expands –>
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>
tr+
<tr>
<td></td>
</tr>
select
<select name=”" id=”"></select>
optgroup+
<optgroup><option value=”"></option></optgroup>
optg+
<optgroup><option value=”"></option></optgroup>
empty
<empty></empty>


你可能感兴趣的:(DI)