当前位置 : 主页 > 网页制作 > css >

css – 如何将input =“radio”与其标签对齐?

来源:互联网 收集:自由互联 发布时间:2021-06-13
我知道这里有很多答案.我搜索过,试图适应,但我一直都失败了,这就是我现在要问的原因. 我有以下问题.我想,两者,标签和输入在同一行:是o否o(o象征输入). 这里我的下面代码,注释我将
我知道这里有很多答案.我搜索过,试图适应,但我一直都失败了,这就是我现在要问的原因.

我有以下问题.我想,两者,标签和输入在同一行:是o否o(o象征输入).

这里我的下面代码,注释我将label的display属性更改为内联块:

<div class="col-sm-3">
        <label>Yes</label>
        <input type="radio" name="yes/no" checked>
        <label>No</label>
        <input type="radio" name="yes/no" >
    </div>

很抱歉回答,虽然有很多类似的问题和答案,但适应它们只是没有工作…

如果您希望输入和标签为“底部对齐”,请尝试使用vertical-align:text-bottom.

input[type='radio'] {
  vertical-align: text-bottom;
  margin-bottom: 1px;
}
div {
  display: inline-block;
  border: 1px solid black;
}
<div class="col-sm-3">
    <label>Yes</label>
    <input type="radio" name="yes/no" checked>
    <label>No</label>
    <input type="radio" name="yes/no" >
</div>
网友评论