Question

今天唯一可用的选项是border = x，其中x是边框的粗细。它看起来很丑陋，因为它概述了小组中的每一个选择。

我希望所有选择都有一个简单的边框。当我进入调试时，我可以手动将fram =“box”添加到生成的表格html中，它看起来很棒。

我无法弄清楚如何将frame =“box”添加到xp：checkBoxGroup我尝试使用属性但没有成功。

有什么想法吗？

Answer 1

如果使用xp:checkBoxGroup XPage运行时将复选框放在表格单元格中，并用fieldset元素包装它。您可以使用一些CSS轻松定位。这就是我如何解决这个问题。

如果您想在复选框组周围添加简单边框，可以执行以下操作：

<style>
    fieldset.xspCheckBox {
        border: 1px solid #333333;
    }
</style>

<xp:checkBoxGroup id="checkBoxGroup1">
    <xp:selectItem
        itemLabel="Blue"
        itemValue="blue">
    </xp:selectItem>
    <xp:selectItem
        itemLabel="Green"
        itemValue="green">
    </xp:selectItem>
</xp:checkBoxGroup>

或者如果你想在每个选项周围都有边框，你可以使用它：

<style>
    fieldset.xspCheckBox {
        border: 0;
    }
    fieldset.xspCheckBox label {
        border: 1px solid #444444;
        padding: 5px;
        cursor: pointer;
    }
    fieldset.xspCheckBox label:hover {
        background: #eeeeee;
    }
</style>

（请注意，:hover类并非真的有必要，但会为所有选项添加悬停效果：取决于您可能不支持的浏览器要求）

Answer 2

只需将带边框定义的样式添加到xp：checkBoxGroup：

<xp:checkBoxGroup id="..." value="..." style="border:1px solid black;">
    ...
</xp:checkBoxGroup>

不是直接将样式放入xp：checkBoxGroup定义，而是使用css类。

使用xp：checkBoxGroup并尝试在所有值周围放置一个简单的框边框

2 个答案: