重力形式 - 带有单独描述的单选按钮

Question

我有一些单选按钮，每个选项都需要文字说明，以便用户知道他们在选择什么。

我想在单选按钮选项中为每个可以接受 HTML 的单选按钮选项添加一个输入字段。这需要在每个单选列表项中显示。我试过简单地将详细信息添加到下面的 HTML 区域，但这不适用于移动屏幕，因为详细信息独立于收音机选项，因此在重新调整屏幕大小时不会出现在每个收音机下方.

Answer 1

您是否考虑过将说明包含在单选按钮标签中？如果您像这样配置每个选择标签：

<div><span>First Choice</span><span>And this is the description.</div>

您可以使用以下样式 CSS:

.ginput_container_radio input {
    vertical-align: bottom;
}

.ginput_container_radio label span {
    display: block;
}

.ginput_container_radio label span:nth-child(2) {
    opacity: 0.6;
    font-size: 0.9em;
}

它看起来像这样：

重力形式 - 带有单独描述的单选按钮

Gravity Forms - Radio buttons with individual descriptions

radio-button

gravity-forms-plugin