Firefox扩展 XUL中关于box的几点操作

主要是用到了box的两种常见形式:vbox(元素垂直摆放),hbox(元素水平摆放)

[b]滚动条[/b]
设置
style="overflow:scroll;"

属性,可以给box添加滚动条

其实只要能设置style,就说明这玩意跟css有扯不开的关系,布局什么的就靠他

[b]子元素排列[/b]
box有一个align的属性,缺省为stretch,它表示其中的子元素会发生纵向扩展
如果给box添加了一个图片标签,这个图片又比较小的情况下,图片会拉伸扭曲变形
可以把设为 start(如果是水平的box,它就是顶端对齐。如果是竖直的box,它就是左对齐)
还可以设为以下值
center   居中
end 如果是水平的box,它就是底端对齐。如果是竖直的box,它就是右对齐。
baseline 文本线对齐,只可以用在水平box上。
stretch 自动扩展


[b]删除子元素[/b]
删除某一个特定的子元素
box.removeChild(child_element)

删除所有的元素(一般初始化的时候用得着)
while (box.firstChild){
box.removeChild(box.firstChild);
}


[b]添加子元素[/b]
box.appendChild(child_element)

例如我要添加一个图片
var image = document.createElement("image"); //这个document要根据上下文来
var image_src = "https://developer.mozilla.org/skins/mozilla/Fox3/img/mdc-logo.png";
image.setAttribute("src",image_src);
box.appendChild(image);


在某一位置插入元素的话可以结合jQuery来操作
$(child1_element).insertAfter($(child2_element))
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值