CSS - max-width

トップ > CSSリファレンス > max-width

概要

属性名 max-width
<length> | <percentage> | none | min-content | max-content | fit-content
初期値none
適用可能要素すべての要素
継承継承しない
メディアvisual
サポート https://caniuse.com/mdn-css_properties_max-width
https://caniuse.com/intrinsic-width

説明

要素の最大の横幅を指定します。

説明
<length>横幅を 10px 1.5em などの長さの単位で指定します。
<percentage>横幅を 10% など、要素の大きさに対するパーセントで指定します。
none横幅を制限しません。
min-contentコンテンツ中の最も長い単語の長さとなります。
max-contentコンテンツ中の文章が改行されない場合の長さとなります。
fit-contentコンテンツ中の文章が改行されない場合の長さとなります。ただし親要素の横幅を超えることはありません。

使用例

HTML
<table>
  <tr>
    <td style="max-width:200px; border:1px solid #999999">
      ああああ
    </td>
  </tr>
</table>
<table>
  <tr>
    <td style="max-width:200px; border:1px solid #999999">
      ああああああああああ
    </td>
  </tr>
</table>
<table>
  <tr>
    <td style="max-width:200px; border:1px solid #999999">
      ああああああああああああああああああああ
    </td>
  </tr>
</table>
表示
ああああ
ああああああああああ
ああああああああああああああああああああ

関連項目

width, height, min-width, min-height, max-width, max-height

リンク


Copyright (C) 1997-2023 杜甫々
初版:1997年7月27日、最終更新:2023年5月7日
http://www.tohoho-web.com/css/prop/max-width.htm