ボックスのサイズ変更を可能にする

resizeプロパティにてボックスのサイズ変更を、ユーザー(閲覧側)で可能にすることができます。

この文章はダミーです。文字の大きさ、量、字間、行間等を確認するために入れています。この文章はダミーです。文字の大きさ、量、字間、行間等を確認するために入れています。この文章はダミーです。文字の大きさ、
.resize_01 {
width:300px;
height:200px;
overflow:auto;
resize:both;
background-color:#EEE;
}

変更を可能するにはresizeプロパティの使用と併せて、
overflowプロパティの値がvisible以外になっている必要があります。
またresizeプロパティの値をhorizontalだと横幅、
verticalだと高さのみの変更となります。

この文章はダミーです。文字の大きさ、量、字間、行間等を確認するために入れています。この文章はダミーです。文字の大きさ、量、字間、行間等を確認するために入れています。この文章はダミーです。文字の大きさ、
.resize_02 {
width:300px;
height:200px;
overflow:auto;
resize:horizontal;
background-color:#00ced1;
}
この文章はダミーです。文字の大きさ、量、字間、行間等を確認するために入れています。この文章はダミーです。文字の大きさ、量、字間、行間等を確認するために入れています。この文章はダミーです。文字の大きさ、
.resize_03 {
width:300px;
height:200px;
overflow:auto;
resize:vertical;
background-color:#98fb98;
}

※なおresieプロパティはIEでは対応していないのでご注意を。

コメントを投稿する

SPONSORED LINK

CATEGORY

RECOMMEND BOOKS

OTHER

あわせて読みたい

トップへ戻る