为什么高度和宽度属性在 Span 元素上不起作用，如何才能使它们起作用？

Span 元素和高度/宽度属性

在 CSS 中，span 元素是一个内联元素。这意味着它没有固有的宽度或高度，并且仅占用容纳其内容所需的空间。因此，设置 span 元素的高度和宽度属性不会产生任何效果。

但是，您可以使用 display 属性将 span 元素转换为块级元素。块级元素可以指定高度和宽度，它们会在页面上占据一个矩形区域。

要使span元素看起来像一个按钮，可以将display属性设置为inline-block或block 。这将允许您应用高度和宽度属性并根据需要设置元素的样式。

这是添加了显示属性的 CSS 代码的更新版本：

span.product__specfield_8_arrow {
    display: inline-block; /* or block */
    background-image:url(../../upload/orng_bg_arrow.png);
    background-repeat:no-repeat;
    background-color:#fc0;
    width:50px !important;
    height:33px !important;
    border: 1px solid #dddddd;
    border-left:none;
    border-radius:5px;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border-bottom-left-radius:0px;
    border-top-left-radius:0px;
    -moz-border-radius-bottomleft:0px;
    -moz-border-radius-topleft:0px;
    -webkit-border-bottom-left-radius:0px;
    -webkit-border-top-left-radius:0px;
    margin:0;
    padding:2px;
    cursor:pointer;
}

进行此更改，span 元素的行为类似于块级元素，并将采用指定的高度和宽度尺寸。

以上是为什么高度和宽度属性在 Span 元素上不起作用，如何才能使它们起作用？的详细内容。更多信息请关注PHP中文网其他相关文章！