Pure.CSS Checkboxex和单选输入

Pure.CSS复选框和收音机

” pure-checkbox”和” pure-radio”类名称用于标准化和对齐复选框和单选输入。

例：

让我们以一个示例来看一个复选框和一个单选按钮。

<!DOCTYPE html>
<html>

<link rel="stylesheet" 
href="https://unpkg.com/purecss@1.0.0/build/pure-min.css" 
integrity="sha384-nn4HPE8lTHyVtfCBi5yW9d20FjT8BJwUXyWZT9InLYax14RDjBj46LmSztkmNP9w" 
crossorigin="anonymous">

<form class="pure-form">
    <label for="option-one" class="pure-checkbox">
        <input id="option-one" type="checkbox" value="">
       This is a checkbox
    </label>

    <label for="option-two" class="pure-radio">
        <input id="option-two" type="radio" name="optionsRadios" value="option1" checked>
        This is a radio button. You can choose this one..
    </label>

    <label for="option-three" class="pure-radio">
        <input id="option-three" type="radio" name="optionsRadios" value="option2">
        ..Or this one!
    </label>
</form>
</html>

立即测试

输出

Pure.CSS复选框和收音机

猜你喜欢