Question

如何在我的html代码中以一种简洁的方式组织复选框？我希望10个框在2行中出现一个，是否有一个特定的方法来排列它们。这是我正在编写的代码。 HTML 5

    <body>
        <form name="myForm" method="post" action="form2.html">
            <table>             
                <tr>
                    <td>Completed Subjects  :</td>
                    <td>
                        <input type="checkbox" value="IPE">IPE 
                        <input type="checkbox" value="CF ">CF
                        <input type="checkbox" value="MIT">MIT
                        <input type="checkbox" value="DCCN-I">DCCN-I
                        <input type="checkbox" value="ELS-I">ELS-I
                        <br/>
                        <input type="checkbox" value="ST-I">ST-I
                        <input type="checkbox" value="ITA">ITA
                        <input type="checkbox" value="FCS">FCS
                        <input type="checkbox" value="DBMS-I">DBMS-I
                        <input type="checkbox" value="ELS-II">ELS-II
                    </td>
                </tr>                       
            </table>
        </form>                         
    </body>
</html>

Answer 1

我有两个选择，就像我看到的那样。使用清单;

ul {
    -moz-column-count: 4;
    -moz-column-gap: 20px;
    -webkit-column-count: 4;
    -webkit-column-gap: 20px;
    column-count: 4;
    column-gap: 20px;
}

使用表格，每个单元格一个复选框;

<table>
    <tr>
        <td><input type="checkbox" value="IPE">IPE</td>
        <td><input type="checkbox" value="CF ">CF</td>
        <td><input type="checkbox" value="MIT">MIT</td>
        <td><input type="checkbox" value="DCCN-I">DCCN-I</td>
        <td><input type="checkbox" value="ELS-I">ELS-I</td>
    </tr><tr>
        <td><input type="checkbox" value="ST-I">ST-I</td>
        <td><input type="checkbox" value="ITA">ITA</td>
        <td><input type="checkbox" value="FCS">FCS</td>
        <td><input type="checkbox" value="DBMS-I">DBMS-I</td>
        <td><input type="checkbox" value="ELS-II">ELS-II</td>
    </tr>
</table>

如何在我的HTML代码中以一种整洁的方式组织复选框？

1 个答案: