高さと幅のプロパティがスパン要素で機能しないのはなぜですか?どうすれば機能させることができますか?

Span 要素と高さ/幅のプロパティ

CSS では、span 要素はインライン要素です。これは、固有の幅や高さがなく、コンテンツを収容するために必要なだけのスペースしか占有しないことを意味します。そのため、span 要素の高さと幅のプロパティを設定しても効果はありません。

ただし、display プロパティを使用して、span 要素をブロックレベルの要素に変換できます。ブロックレベルの要素には高さと幅を指定でき、ページ上の長方形の領域を占めます。

span 要素をボタンのように見せるには、表示プロパティを 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要素はブロックレベル要素のように動作し、指定された高さと幅の寸法をとります。

以上が高さと幅のプロパティがスパン要素で機能しないのはなぜですか?どうすれば機能させることができますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。