« web:formのmethodの初期値 | トップページ | 京阪シティモール(旧松坂屋)前に、巨大アヒル隊長 »

2009年8月18日 (火)

web:HTMLのTABLEで、はみ出したり・表示しきれない文字を制限

たとえば以下のような場合、一列目の値は、列の幅を超えているため
数行に渡って表示されます。

一列目 二列目
あいうえおかきくけこあいうえおかきくけこあいうえおかきくけこあいうえおかきくけこあいうえおかきくけこ かきくけこ

そこで、値をブロック(<div>)で囲みoverflow:hiddenを指定してやる事で
領域外の文字表示を制限する事ができます。

<div title="あいうえおかきくけこあいうえおかきくけこあいうえおかきくけこ" style="overflow: hidden; width: 100%; height: 18px;">

title属性に値設定してやる事で、非表示部分の確認も行えます。

一列目 二列目
あいうえおかきくけこあいうえおかきくけこあいうえおかきくけこあいうえおかきくけこあいうえおかきくけこ
かきくけこ

ちなみに、高さ(width) 幅(height)を指定しなかった場合は以下のようになってしまいます。

一列目 二列目
あいうえおかきくけこあいうえおかきくけこあいうえおかきくけこあいうえおかきくけこあいうえおかきくけこ
かきくけこ

|

« web:formのmethodの初期値 | トップページ | 京阪シティモール(旧松坂屋)前に、巨大アヒル隊長 »

コメント

コメントを書く



(ウェブ上には掲載しません)


コメントは記事投稿者が公開するまで表示されません。



トラックバック


この記事へのトラックバック一覧です: web:HTMLのTABLEで、はみ出したり・表示しきれない文字を制限:

« web:formのmethodの初期値 | トップページ | 京阪シティモール(旧松坂屋)前に、巨大アヒル隊長 »