如何修改物化css格式?

时间:2019-06-26 07:25:27

标签: html css materialize

我正在尝试使用在网上找到的物化CSS来设置页面样式,现在我想修改某些表单(输入,选择选项)。由于我不擅长Web开发,所以我这样做了:

<div class="row lt-row" style="margin-bottom: 0; line-height: 5px; height: 30px">
    <div class="input-field col s6 l6" style="margin-bottom: 0; line-height: 5px; height: 30px">
        <input id="input_third_name" style="height: 30px;" name="emp_third_name" type="text" class="validate">
        <label for="input_third_name">Third Name</label>
    </div>
    <div class="input-field col s6 l6" style="margin-bottom: 0; line-height: 5px; height: 30px">
        <input id="input_family_name" style="height: 30px;" name="emp_family_name" type="text" class="validate">
        <label for="input_family_name">Family Name</label>
    </div>
</div>
<div class="row lt-row" style="margin-bottom: 0; line-height: 5px; height: 30px">
    <div class="input-field col s6 l6" style="margin-bottom: 0; line-height: 5px; height: 30px">
        <label>Gender</label>
        <select id="gender" name="gender_value">
            <option value = "" disabled selected><< Pls select >></option>
            <option value ="Male">Male</option>
            <option value ="Male">Female</option>
        </select>   
    </div>
    <div class="input-field col s6 l6" style="margin-bottom: 0; line-height: 5px; height: 30px">
        <label>Degree</label>
        <select id="degree" name="degree_value">
            <option value = "" disabled selected><< Pls select >></option>
            <option value ="High School">High School</option>
            <option value ="Vocational">High School</option>
            <option value ="Bachelor Degree">Female</option>
        </select>   
    </div>
</div>

但是我的输出像下面的图片一样,如何获得我想要的表格?

enter image description here

0 个答案:

没有答案