Css 使用<;图例>;引导程序4中的标记和网格系统

Css 使用<;图例>;引导程序4中的标记和网格系统,css,twitter-bootstrap,bootstrap-4,twitter-bootstrap-3,Css,Twitter Bootstrap,Bootstrap 4,Twitter Bootstrap 3,它应该以这种方式显示: 而是以这种方式显示: 请看“水果”一词的意思 我使用的是引导程序4 alpha v6。这是密码 <fieldset class="form-group row"> <div class="col-sm-3"><legend class="col-form-legend">Fruit</legend></div> <div cla

它应该以这种方式显示:

而是以这种方式显示:

请看“水果”一词的意思

我使用的是引导程序4 alpha v6。这是密码

<fieldset class="form-group row">
    <div class="col-sm-3"><legend class="col-form-legend">Fruit</legend></div>
    <div class="offset-sm-3 col-sm-9">
        <div class="form-check row">
            <label class="form-check-label">
                <input class="form-check-input" type="radio" name="legendradio" id="legendradio1" value="1">Apple
            </label>
        </div>
        <div class="form-check row">
            <label class="form-check-label">
                <input class="form-check-input" type="radio" name="legendradio" id="legendradio2" value="2">Orange
            </label>    
        </div>
        <div class="form-check row">
            <label class="form-check-label">
                <input type="radio" class="form-check-input" name="legendradio" id="legendradio3" value="1">Watermelon
            </label>
        </div>
    </div>
</fieldset>

果
苹果
橙色
西瓜

通过向以下html元素添加类,对其进行填充:

<div class="col-sm-3 padding"><legend class="col-form-legend">Fruit</legend></div>
水果



CSS:.padding{padding:Npx}

通过向以下html元素添加类来对其进行填充:

<div class="col-sm-3 padding"><legend class="col-form-legend">Fruit</legend></div>
水果


CSS:.padding{padding:Npx}