css - 为什么这个表单标签样式不行

Question

对于我的生活，我无法设置这些标签的样式，因为事实上在 css 中设置某些元素的样式甚至都行不通。任何帮助/解释表示赞赏

<div id="calcbox">
    <form name="form1" class="contact_form">
        <ul>
            <li>
                <label>Item Cost</label>
                <input type="text" id="itemCost" placeholder="$ 0.00" />
            </li>
            <li>
                <input type="button" class="calculatebutton" value="Cash Payment" />
            </li>
            <li>
                <input type="button" class="calculatebutton" value="Card Payment" />
            </li>
            <li>
                <label style="width:100px;">Purchase Cost</label>
                <input type="text" id="total" placeholder="$ 0.00" readonly style="clear:both" />
            </li>
        </ul>
    </form>
</div>

Answer 1

我不确定它是否与width. 但是，只要这是您问题中唯一的 CSS，我就会假设它。

标签是内联元素，而不是块。设置任意width（以及其他一些属性）将不起作用，它将适合其内容。

不过，有一个解决方案：你可以改变它的显示行为style="width:100px; display: inline-block"