EditPlus(EP)帮助手册中列出了EP的主要功能:
- 语法高亮
- Internet功能
- HTML工具栏
- 文档选择器
- 用户工具和帮助文件
- 自动完成
- 素材文本窗口
- 文档模板
- 其他功能
其中“语法高亮”,“自动完成”和“文档模板”在EP中非常灵活,用户皆可根据自己需要进行配置。EP默认支持HTML、CSS、PHP、ASP、Perl、C/C++、Java、JavaScript 和 VBScript的语法高亮显示,基本上无需再做过多设置。而“自动完成”和“文档模板”默认支持有限,而且可能并不符合个人日常的一些编码习惯,那么则需要我们自己根据习惯进行配置,才能得心应手。
自动完成
自定义自动完成功能可分为两步:1.编写自动完成文件;2.指定关联路径。
#TITLE=CSS
;EditPlus Auto-completion file v1.0 written by wondger(http://omiga.org).
;This file is provided as a default auto-completion file for CSS.
#CASE=n
#T=reset
/*reset*/
body,h1,h2,h3,h4,h5,h6,ul,ol,p,dl,dt,dd,th,td{margin:0; padding:0;}
table{border-collapse:collapse;}
li{list-style:none;}
em{font-style:normal;}
img{border:none;}
a img{vertical-algin:top;}
/*reset*/
#T={
{^!}
#T=m
margin:^!px;
#T=ma
margin:0 auto;^!
#T=mt
margin-top:^!px;
#T=mr
margin-right:^!px;
#T=mb
margin-bottom:^!px;
#T=ml
margin-left:^!px;
以上为一段CSS自动完成文件代码。自动完成文件每个语句必须以“#”开头。
- #TITLE – 为自动完成文件标题
- #CASE – 指定是否区分大小写。‘y’表示是,‘n’表示否。默认值是‘n’。
- 每个自动完成片段以“#t=title”形式的开始。title是你要你扩展的缩写词,换行后开始匹配自动完成文本,直到遇到“#”符号。如:
#T=m
margin:^!px;
- ^! – 指定每一次自动完成后光标的停留位置。
- ^ – 转义字符,如果需要在自动完成文本中插入“^”或“#”则需要先进行转义:“^^”,“^#”。
自动完成文件编写完成后,保存为.acp文件在任一文件目录即可。 阅读全文»
尽管HTML5草案最终定稿要在遥远的2012,而最终的标准的正式发布可能会在更遥远的2022,但是还是可以YY一下,听说safari4已经支持HTML5了~···
HTML5主要在嵌入音频、视频、图片的函数、客户端数据存储,以及交互式文档方面增加了很多新的特性,同时也包括新的页面元素,比如 <header>, <section>, <footer>, 以及 <figure>。
同时HTML5还增加了7个标准属性,而不再支持HTML 4.01 中的accesskey属性。
- contenteditable 设置是否允许用户编辑元素。
- contentextmenu 给元素设置一个上下文菜单。
- draggable 设置是否允许用户拖动元素。
- irrelevant 设置元素是否相关。不显示非相关的元素。
- ref 引用另一个文档或本文档上另一个位置。仅在 template 属性设置时使用。
- registrationmark 为元素设置拍照。可规定于任何 <rule> 元素的后代元素,除了 <nest> 元素。
- template 引用应该应用到该元素的另一个文档或本文档上另一个位置。
当然,也更新了很多事件属性。
- onabort 发生 abort 事件时运行脚本。
- onbeforeonload 在元素加载前运行脚本。
- oncontextmenu 当菜单被触发时运行脚本。
- ondrag 只要脚本在被拖动就运行脚本。
- ondragend 在拖动操作结束时运行脚本。
- ondragenter 当元素被拖动到一个合法的放置目标时,执行脚本。
- ondragleave 当元素离开合法的放置目标时。
- ondragover 只要元素正在合法的放置目标上拖动时,就执行脚本。
- ondragstart 在拖动操作开始时执行脚本。
- ondrop 当元素正在被拖动时执行脚本。
- onerror 当元素加载的过程中出现错误时执行脚本。
- onmessage 当 message 事件触发时执行脚本。
- onmousewheel 当鼠标滚轮滚动时执行脚本。
- onresize 当元素调整大小时运行脚本。
- onscroll 当元素滚动条被滚动时执行脚本。
- onunload 当文档卸载时运行脚本。
label用来向控件定义标注(标记),如果不是用于这个用途,那完全也没有必要使用label,使用span就可以了。使用label可以与控件建立一种连接,当选择label时,即会触发此控件,即该控件会因为与之连接的label的选择而获取到焦点。
通常这一工作是通过label标签的for属性来完成的,将for属性指向一个控件的id即完成连接。
<label for="uname">姓名:</label><input id="uname" name="u_name" type="text" />
这就是label的显示连接。
而隐式连接就不再需要for属性,只需简单地将控件包含在label标签中即可。
<label>密码: <input type="password" name="psw" /></label>
label与其他控件建立连接的这两种方法,绝大部分现代浏览器都是支持的(IE6不支持隐式连接方式)。隐式方式虽简单快捷却缺乏良好的语义结构,所以还是不赞成使用;显示方式良好的结构已表现出一定的语义(结构也应该是具有语义的),所以显示方式仍然是最佳的选择。
基础的东西在这里,就不重复了~
<caption>
<catpiton>用于定义一个表格的标题,书写时候需紧随<table>标签之后。可通过样式属性:caption-side:left 设置标题在表格中所处的位置。但是目前仅非IE浏览器支持该样式属性,而IE浏览器中可通过标签的align属性完成(IE6,IE7仅支持top,bottom)。同时<caption>标签无法继承其上级table的某些样式属性(如backgroud,border等)。同时FF对caption的出来还表现出一些异常,如当对其上级<table>设置外边距时,<caption>并不会随上级<table>流动~查看演示
<colgroup>,<col>
<colgroup>用于对表格中的列进行分组。如:我们将表格中的第一列设置为红字白底。
查看演示我们可以看到不同浏览器对该标签的支持都不尽相同,safari对该标签的支持相当苛刻,需将该标签紧随<caption>/<table>书写。同时在非IE浏览器中该标签的书写位置不会影响到<thead>中单元格的显示属性,<thead>中的列亦可应用设置。而IE中只有位于<colgroup>之后的表格对象方可应用此标签设置,同时部分浏览器对通过该标签进行的样式设置无效,经测试,目前仅IE支持最好。查看演示
<col>为表格中一个或多个列定义属性值,只能在colgroup中使用此元素。如:将表格中的第一列设置为红字白底,第二,第三列设置为黑底白字。查看演示
<col>的span属性定义其影响的列数~
表格边框
表格的默认边框是很丑陋的,一个最为关键的问题是相邻单元格的重复边框,所以我们不得不动手对其进行美化。
方法一:取消默认的表格,单元格设置,将单元格间距设置为指定宽度,为表格设置背景色进而实现无重复边框。查看演示
方法二:更为简单有效的方法是通过设置border-collapes。查看演示