【css】textarea-通过resize:none 禁止拖动设置大小

使用 resize 属性可防止调整 textareas 的大小(禁用右下角的"抓取器"):

没有设置resize:none

代码:

xml 复制代码
<!DOCTYPE html>
<html>
<head>
<style> 
textarea {
  width: 100%;
  height: 150px;
  padding: 12px 20px;
  box-sizing: border-box;
  border: 2px solid #ccc;
  border-radius: 4px;
  background-color: #f8f8f8;
  font-size: 16px;
}
</style>
</head>
<body>
<form>
  <textarea>Some text...

渲染效果:可以拖动设置大小

添加resize:none

xml 复制代码
<!DOCTYPE html>
<html>
<head>
<style> 
textarea {
  width: 100%;
  height: 150px;
  padding: 12px 20px;
  box-sizing: border-box;
  border: 2px solid #ccc;
  border-radius: 4px;
  background-color: #f8f8f8;
  font-size: 16px;
  resize:none;
}
</style>
</head>
<body>
<form>
  <textarea>Some text...

渲染效果:

相关推荐
用户222645989434111 分钟前
CSS单位全解析:从像素到视口的响应式设计
前端
Mapmost12 分钟前
【实景三维】还再为渲染发愁?手把手教你大场景如何实现“精细”与“流畅”平衡!
前端
钱多多81014 分钟前
Vue版本降级操作指南(解决依赖冲突与版本不一致问题)
前端·javascript·vue.js·前端框架
门思科技14 分钟前
门思科技正式开放 ThinkLink 纯国产化物联网平台免费部署方案
javascript·科技·物联网
San3016 分钟前
深度解析 React 组件化开发:从 Props 通信到样式管理的进阶指南
前端·javascript·react.js
AAA阿giao17 分钟前
深度解析 React 项目架构:从文件结构到核心 API 的全面拆解
前端·javascript·react.js
LYFlied24 分钟前
Vue3虚拟DOM更新机制源码深度解析
前端·算法·面试·vue·源码解读
1024肥宅30 分钟前
综合项目实践:小型框架/库全链路实现
前端·面试·mvvm
文心快码BaiduComate31 分钟前
Spec模式赋能百度网盘场景提效
前端·程序员·前端框架
刺客-Andy36 分钟前
js高频面试题 50道及答案
开发语言·javascript·ecmascript