1、一、XUL的元素及属性描述：
1、 一个 XUL 文件可以有任何名字，但它必须拥有一个 .xul 的扩展名。
2、 简单声明一个XUL文件，通常在每个XUL文件都会添加这一行。
3、 这一行是用来指定使用的样式表的。这是XML用于导入样式表的语法。
4、
2、ndow/>标签的几个属性：
(1) id 属性用作标识以便被窗体脚本引用。
(2) title 属性描述显示时将在窗体的标题栏上显示文本。
(3) orient 的属性确定窗口中元件的排布。其值有：horizontal窗体应该横过窗体水平放置；Vertical 表示元件将成一列放置
(4) xmlns=http://www.mozilla.org/keymaster/gateKeeper/there.is.only.xul 这一行声明了XUL的名空间，将它放在窗口元件表示它的所有子元件都是XUL，Mozilla内部会识别这个 URL;
(5) 表示
3、注释
6、 打开窗口 window.open(url,windowname,flags) 其中url 表示文件路径，windowname 表示窗体的名字，flags 是指chrome 文档
7、 的属性：
（1） id 用来表识按钮的唯一标识。
（2） class 按钮的样式表
（3） label 标签会显示在按钮上
（4） image 在按钮上显示指定路径的图片
（5） disabled 如果这个属性被设置为true,按钮就会被禁止，如果这个属性没有表示这个按钮会被启动
（6） accesskey 设置快捷键，通常是字母
8、 标签元素属性：
4、
（1） value 属性被用于制定要显示的文本
（2） Control 属性去设置关联的标签，设置control属性的值会触发与这个值对应的id的元素
9、 标签元属描述
在没有一些特定的关联操作的文本时你可以使用 description 标签，这个元素使用于在对话框的上面或实例的一组控制的文本提示信息. 既可以在 value 属性中指定单行的文本也可以在开合标签之间填充一大块的文本
10、 文本输入框的属性：
（1） id 属性：控件的唯一标识
（2） class属性：输入框的样式表
（3） value属性：指定输入框的文
5、本
（4） disabled属性：文本输入框是否禁用
（5） type 属性：可以将这个属性设置为password,创建一个输入框隐藏用户输入内容，通常为密码框
（6） maxlength 属性： 输入框允许输入的字符最大数量；
（7） multiline 属性： 其值若为true 表示文本框将显示多行。若为 false 文本不显示多行
11、 单选按钮的属性：
(1) id 属性：控件的唯一标识
(2) label 属性： 单选按钮的文本
(3) disabled 属性：其值可以是true或false,若为true表示按钮被禁用，反之为启 用
6、4) accesskey 属性：用于选中元素的快捷键
12、 单选按钮组属性：
若在一个组中只能选择一个
13、 多选框属性：
（1） id 属性：控件的唯一标识
（2） checked属性：表示受否被选中，其值有true或false
（3） label 属性：指定标签的文本
（4） selected 属性：和checked属性类似，其值有true或false
14、 列表控件属性：
描述：listbox元素用于创建多行的列表框，它的工作方法类似
7、于在HTML中
的select元素，和连用创建下拉列表，相似于HTML
中的。
（1） id属性： 控件的唯一标识
（2） rows属性：指定一次显示几行
例子如下：
8、"Raspberry Ripple" value="raspripple"/>
15、 多列列表框：
描述：列表框也支持多列。每个单元格可以有独有的内容，即使只使用文本。当用户选择列表中的一个项目时，当前的行将被选中。你不能只选中其中的一个单元格。
例子如下：
9、
10、el="House Painter"/>
11、
上面例子中的元素用来定义列字段集，元素用来定义每列的外观，元素用来定义一行，类似HTML中的标签;用来定义每个单元，类似HTML中的标签；使用和来定义表头
16、 下拉列表：
描述：XUL中的下拉列表类似HTML中使用select元素创建的下拉列表。XUL中的menulist元素可以实现这种效果。
的属性：
12、 accesskey 属性：设置快捷键；
disabled 属性：设置控键是否被禁用;
open 属性：其值为true或false,如果为true,菜单列表显示，否则隐藏；
label属性：设置文本；
aditable属性：其值为true或false ， 如果为true表示此菜单列表可以编辑，如为false则不能编辑。
例子如下：
13、bel="Bus">
属性：
14、 Id 属性： 进度条的唯一标识符。
Mode属性： 进度条的类型。如果设置为determined,进度条就是确定型进行度，在任务完成时填满。如果设置为undetermined，这个进度条就是不确定型进度条。如果不指定这个属性默认为确定型。
Value 属性： 当前进度条的尺度值。只能在确定型的进度条中使用这个属性。这个值的范围为0%到100%的百分值。
例子演示：
<
15、progressmeter value=”50%” style=”margin: 4px;”/>
18、 增加HTML元素到窗口
（1） XHTML命名空间：
描述：为了在XUL文件中使用HTML元素，必须声明要用到的XHTML命令空间。这个方法是Mozilla从XUL中区分HTML标签的。
例子演示：
16、
17、 Xmls:html=http://www.w3.org/1999/xhtml
Xmlns=http://www.mozilla.org/keymaster/gatekeeper/therer.is.only.xul;>
注意事项：
1、 必须在每个标签的开始增加一个html:的前缀；
2、 标签必须用小写
3、 “双引号”必须完成所有属性值括起来。
4、 在没有内容的xml标签的末端(>)前一定要加上结束(/)；
（3） 使用HTML元素：
例子演示：
18、 version=”1.0”？>
19、Xmlns=http://www.mozilla.org/keymaster/gatekeeper/therer.is.only.xul;>
A simple table
20、
元素
描述：spacer用于在窗口中放置一片空白，它多用于用户调整窗口大小
时它可以拉伸或者收缩。
元素的属性：
用于指定元素可以改变自身的尺寸去填充它所在的盒子(窗口)，它说明在一个盒容器的子容器中填入多少的空白空间。
例子演示：
21、
20、 按钮:属性：
Image 属性：可以通过指定URL为按钮添加图像；
Style 属性： 在按钮上指定图像的另一个方法是使用样式表(CSS list-style-image:url(‘图片的路径’)；
22、
dir 属性: 属性控制图像和文本方向。设置这个属性的值为reverse,图像将会放在文本的右边。使用normal值，或删除这个属性，图像将会放在文本左边。
Orient 属性： 属性用于在将图片放在文本的上面或下面。默认值时horizontal用于将图像放在文本的左或右。也可以使用值vertical将图像放在上方或下方。如果用在normal的意思时将图像放在文本的上方，而用在reverse的意思时将图像放在文本的下方。
crop 属性： 它可以用来裁剪元素的内容。当元素的宽度超过maxwidth时，超出的部分会去掉，变成...。不过这个属性只可以用在descript
23、ion和有label的元素中。其值有left,righr,none,center;
left:指超出的文本部分从文本的左部分裁剪。
Right:指超的出文本部分从文本的右边裁剪。
Center:指超出的文本部分不文本的中间裁剪。
None:指超出的不分文本不被裁减，默认值为none;
24、
25、
弹出菜单按钮：
26、
”
21、 箱体的基本语法：
注释：
27、
hbox元素：用来创建一个水平方向的盒子。每个放在hbox的元素将被水平地排成一行。
Hbox属性：
align属性：控制内部元素的垂直位置，其值有start,center,end,baseline,stretch;
start 是指box里面的元素靠顶端对齐。
28、center 是指 box 里面的元素靠中间对其。
end 是指 box 里面的元素底端对齐。
baseline 是指 box 里面的元素按照文本底线对齐。
sretch 自动扩展
vbox元素：用来创建一个垂直方向的盒子。每个放在vbox的元素将被垂直地排成一列
29、 例子演示：
1、 登陆提示范例
2、 文本框对齐
30、bel control=”login” value=”Login:”>
31、x>
3、 文件查找对话框示范
Enter your search criteria below and the Find button to begin the search.
32、
22、 元素属性：
Width 属性： 指定元素的宽度。
Height 属性： 指定元素的高度。
Minwidth 属性：指定元素的最小宽度。
Minheight 属性：指定元素的最小高度。
33、
Maxheight 属性：指定元素的最大宽度。
元素：通过修改orient为"horizental"，表示元素水平摆放。为"vertical" 表示元素垂直摆放。
Pack属性：
Start 对于水平box，他就是左对齐。对于竖直的box，他就是顶端对齐。
Center 居中；
End 如说是水平box，他就是右对齐。对于竖直的box，他就是底端对齐。
34、 align 属性：
start如果是水平的box，它就是顶端对齐。如果是竖直的box，它就是左对齐。
center居中
end如果是水平的box，它就是底端对齐。如果是竖直的box，它就是右对齐。
baseline文本线对齐，只可以用在水平box上。
stretch自动扩展
23、 分组框：
（1） gropbox的描述：gropbox是一个box容器，里面的元素会按照box布局规则来显示。与其他box相比，gropbox有以下特点：
1、 默认有边框。你可以通过修改其cess来改变边框。
2、 可以添加标题(caption).标题会
35、显示在gropbox的左上方。
（2） gropbox的属性：
align:start 如果是水平的box，它就是顶端对齐。如果是竖直的box，它就是左对齐。
Center 居中；
Baseline 文本线对齐，只可以用在水平box上。
End 如果是水平box，他就是底端对齐。如果是竖直的box，他就是右对齐。
Stretch 制动扩展。
Pack属性：
36、 Start 对于水平box，他就是左对齐。对于竖直的box，他就是顶端对齐。
Center 居中；
End 如说是水平box，他就是右对齐。对于竖直的box，他就是底端对齐。
例子演示：
37、ion value="Phone Booth"/>
或
（3） radiogroup的描述：radiogroup首先是一个box容器，里面可以放xul元素，但radiogroup对单选框(radio)有特殊意义。可以通过selectedItem 来访问选中的radio。
例子演示：
39、 value=”specify” label=”Specify Number:”/>
24、 层和卡片：
Statck 元素：
statck 是按照绝对位置定位布局方式的容器。因此，align、pack、dir、orient等属性对于stack来说是无效的。Stack内部元素的位置取决于元素的left、top属性。这种布局模式类似于VB或Delphi的布局模式。需要注意的是：内部元素的left、top是指相对于stock的位置，而不是相对于window或者screen的位
40、置。所谓的绝对定位，是指其直接孩子元素。非直接孩子元素不执行stack的布局逻辑。
例子演示：
41、
42、 例子演示：
43、 或
25、 分页组：
描述及语法：
tabbox用于界面元素的分页显示。常用于显示用户选项等界面元素多，界面大小有限的用户界面。用户可以通过选择不同的tab
44、页来查看不同的内容。
xul中提供了5个元素来实现分页组
tabbox：最外层的容器，一般内部包含一个tabs和tabpanels。
tabs：tab的容器。当然你也可以在里面加入其他的xul元素来丰富导航 tab的界面。
tab：具体的每一个分页卡，用户通过选择不同的tab来切换显示页。
tabpanels：tabpanel的容器。
tabpanel：里面放置具体的页面内容。
tab与tabpanel的对应关系是按照他们在各自容器中的序号来确定的。tabs中的第一个tab对应tabpanels中的第一个tabpanel。
基本语法如下：
-- tab elements go here --
-- tabpanel elements go here --
由于tabbox本身是一个容器，因此，tabs的显示位置取决于它在tabbox中的顺序以及tabbox的orient、dir属性。
tabbox的大小取决于它内部最大tabpanel的大小，因此，在切换tab页的时候，tabbox的大小不会随着tab页切换而改变。
例子演示：
46、
47、ls>
当前tab页的tab元素的selected属性是true。
如果我们将tabbox的orient设置为水平模式，tabs会出现在左面。
26、 表格：
描述：其组件包括grid，columns，column，rows和row。Grid包含排列整齐的组件就像表格一样。在grid内，可以声明columns，定义header及column属性；还可以声明rows。使用rows组件可以声明一套row，即为grid元素的子组件。每个子元素为指定列的一行。
例子演示：
48、
49、
