2021/05/10

MANUAL

FAQ:サンプルコード:一覧画面で横幅のサイズを調整したい

一覧画面で横幅のサイズを調整したい場合、以下のようなスタイルを設定することで実現できます。 ![image](/binaries/8a9d73e708174e97b2e6e141595284f9) 対象のテーブルを開いて、「[テーブルの管理](/manual/table-management)」「[スタイル](/manual/table-management-style)」を開きます。 以下のCSSを記述し「出力先」の「[一覧](/manual/table-management-grid)」を選択することで一覧画面の表全体、または列ごとの横幅を指定することができます。 ##### CSS ``` table { table-layout: fixed; width: 80%; /*表全体の横幅を指定。ウィンドウ全体なら100%*/ } th[data-name="Title"] {width: 35%; } /*タイトル列の横幅*/ th[data-name="ClassA"] {width: 10%; } /*分類A列の横幅*/ th[data-name="NumA"] {width: 5%; } /*数値A列の横幅*/ th[data-name="DateA"] {width: 15%; } /*日付A列の横幅*/ th[data-name="DescriptionA"] {width: 25%; } /*説明A列の横幅*/ th[data-name="CheckA"] {width: 5%; } /*チェックA列の横幅*/ ``` ![image](/binaries/b3944c04c344491b8ca390186443fd7a)
このページをシェアする