我正在嘗試刪除a & lttextarea & gt出現在右下角。
以下是我的意思的一個例子(來自Chrome):
怎么去掉那些對角線?
只需在你的CSS文件中添加
textarea { resize: none; }
后期(2019)編輯: 與我的這個回答以及應用于textarea元素的resize: none聲明的GitHub代碼搜索結果數量的增加相關,我寫了一些關于為什么我認為textarea上的CSS resize none對UX不利的內容:
通常情況下,textarea被限制在一定數量的行和列,或者它有通過CSS定義的固定寬度和高度。僅僅根據我自己的經驗,在回答論壇問題、在網站上寫聯系表格、填寫實時聊天彈出窗口甚至在Twitter上發私信時,這是非常令人沮喪的。
有時,您需要鍵入一個由許多段落組成的長回復,并且將該文本包裝在一個小的文本區域框中,這使得在您鍵入時很難理解和理解。例如,有很多次我不得不在Notepad++中寫下那段文字,然后將整個回復粘貼到那個小的文本區域中。我承認我也打開了DevTools來覆蓋resize: none聲明,但這并不是一種真正有效的方法。
來自https://catalin.red/css-resize-none-is-bad-for-ux/
因此,在將上述內容添加到樣式表之前,您可能需要檢查一下這一點。
它就像下面的代碼一樣簡單。只需將文本區域的樣式設置為resize: none
<textarea style="resize: none"></textarea>
超文本標記語言
厚顏無恥
textarea {
position: relative;
z-index: 1;
min-width: 1141px;
min-height: 58px;
}
.resizer {
position: relative;
display: inline-block;
&:after {
content: "";
border-top: 8px solid #1c87c7;
border-left: 8px solid transparent;
border-right: 8px solid transparent;
-webkit-transform: rotate(-45deg);
z-index: 1;
opacity: 0.5;
position: absolute;
bottom: 1px;
right: -3px;
pointer-events: none;
}
}
.arrow-resizer-textarea {
height: 0;
width: 0;
border-top: 8px solid #1c87c7;
border-left: 8px solid transparent;
border-right: 8px solid transparent;
-webkit-transform: rotate(-45deg);
position: absolute;
bottom: 1px;
right: -3px;
pointer-events: none;
z-index: 2;
}
上一篇mysql刪除一行的語句
下一篇vue cookie模塊