1. 程式人生 > >去掉textarea小三角,禁止調整大小

去掉textarea小三角,禁止調整大小

如果你使用谷歌瀏覽器或火狐瀏覽器,你會發現頁面上的textarea元素的右下角有個小三角,用滑鼠箭頭拖拽它,你的textarea就能隨著放大或縮小。這是現代瀏覽器為方便使用者而新增的一個輔助功能(很遺憾,不包括IE,如果你使用IE,是看不到的。)。Web程式設計師在設計網頁時,一般給了textarea一個固定的長寬,通常是配合佈局而設定。但挑剔的使用者往往會認為太小或太大。有了這個可以調整大小的工具後,使用者就可以自己選擇合適的大小了。

但是,有時候是應用的需要,Web程式設計師需要禁止這個可以調整textarea大小的功能(IE完全沒這個問題!),也就是去掉右下角的小三角,有什麼辦法呢?很簡單,使用CSS的resize

屬性。

<style type="text/css">
textarea {
    resize: none;
}
</style>
resize屬性設定為nonetextarea就變成了固定大小,小三角也消失了