html – 复选框的CSS格式

我有一个复选框列表,每个复选框都有一个标签：

    Box" id="patient-birth_city" name="patient-birth_city" />
    Box" id="patient-birth_state" name="patient-birth_state" />
    Box" id="patient-birth_country" name="patient-birth_country" />
    

Without using any CSS它们显示在同一行(我想它们有默认的“内联”或“块内联”显示).问题是我无法修改HTML结构,我需要每对复选框标签出现在一个新行中. Like this.是否可以只使用CSS？

最佳答案

标签标签的好处是你可以包装输入元素：

Box" id="birth_city" name="birth_city" />
    City
Box" id="birth_state" name="birth_state" />
    State
Box" id="birth_country" name="birth_country" />
    Country

如果你添加以下CSS：

label {
    display: block;   
}

它会以你想要的方式显示它.

演示here

由于您无法编辑HTML,因此该CSS可以正常工作：

input,label {
    float: left;   
}

input {
    clear: both;    
}

演示here

原文地址：https://www.jb51.cc/html/426723.html

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 [e-mail] 举报，一经查实，本站将立刻删除。