`

FireFox扩展 在XUL的tabbox标签中引入一个网页

阅读更多
tabbox是多页签的容器
tabs中的tab是用来表示页签的头部
tabpanels下的tabpannel是页签的内容
tabs中元素顺序与tabpannel元素顺序对应

引入网页在tabpanel中使用browser也可以使用iframe

   <tabbox id="tab_list" flex="1" >
      <tabs>
        <tab label="javaeye"/>
        <tab label="网易" />
      </tabs>
      <tabpanels class="tps" flex="1">
        <tabpanel>
          <browser id="page_content" type="content" flex="1" src="http://www.iteye.com" />
        </tabpanel>
        <tabpanel>
          <browser id="page_content" type="content" flex="1" src="http://www.163.com" />
        </tabpanel>
      </tabpanels>
    </tabbox>


上面代码中flex属性,非常重要,如果没有这个属性显示会有很大问题
官网对flex的解释:
flex
Type: string (representing an integer)
Indicates the flexibility of the element, which indicates how an element's container distributes remaining empty space among its children. Flexible elements grow and shrink to fit their given space. Elements with larger flex values will be made larger than elements with lower flex values, at the ratio determined by the two elements. The actual value is not relevant unless there are other flexible elements within the same container. Once the default sizes of elements in a box are calculated, the remaining space in the box is divided among the flexible elements, according to their flex ratios. Specifying a flex value of 0 has the same effect as leaving the flex attribute out entirely.

效果如附件所示
  • 大小: 80.7 KB
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics