1. ホーム
  2. Web制作
  3. html5

htmlでspanの幅を設定する方法

2022-01-14 12:28:57

これは、シェア HTML span タグの幅をどのように設定するかという問題があります。

スパンタグ

span はインライン要素を表し、以下と同等です。 inline 属性は、要素の幅に基づいて自分自身を拡張するだけで、幅を自分で設定した場合は機能しません。

そのため、特に span 要素を幅に設定せず、? その方法をいくつか紹介します。

方法1

セット span 属性に span{display:block}; というようにレンダリングします。

<図

しかし、この書き方では span タグは div はともにブロックレベルの要素を示す。

推奨インデックス: :star2:

モード2

使用方法 float 属性を設定します。 span{float:left} と表示され、次のような効果が得られます。

<図

から float は、このコンテンツの一部を標準的なドキュメントフローから外すので、幅を設定してください。ただし、最後にキャッシュをクリアするのを忘れないように。

書かれているコード量の関係で、推奨インデックス: :star2::star2::star2::star2:

ヒント を理解しないでください。 float 属性は、自分でBaiduで調べてください。

ウェイ3

使用方法 display:inline-block で方法2と同じようにレンダリングします。

display よく使われる属性は3つあり、1つは inline はインライン要素で、これは span が似ています。 block はブロックレベル要素で div が似ています。 inline-block この2つを組み合わせることで、幅を自由に設定することができ、別行動にならない。

コードが少なく、推奨インデックス: :star2::star2::star2::star2::star2:

以上、本記事の全内容を紹介しましたが、学習の一助となり、さらにScript Houseを応援していただければ幸いです。