CSS3的resize属性使用初探


Posted in HTML / CSS onSeptember 27, 2015

语法:
resize:none | both | horizontal | vertical
默认值:none
适用于:所有设置了overflow除了visible之外的元素
继承性:无
取值:
none:
不允许用户调整元素大小。
both:
用户可以调节元素的宽度和高度。
horizontal:
用户可以调节元素的宽度
vertical:
用户可以调节元素的高度。
说明:
设置或检索对象的区域是否允许用户缩放,调节元素尺寸大小。
如果希望此属性生效,需要设置对象的overflow属性,值可以是auto,hidden或scroll。
对应的脚本特性为resize。

为了增强用户体验,CSS 3增加了很多新的属性,其中一个重要的属性就是resize,它允许用户通过拖动的方式来修改元素的尺寸。

样例代码:

CSS Code复制内容到剪贴板
  1. .box {   
  2.     width600px;   
  3.     height300px;   
  4.     border1px solid #000;   
  5.     resize: both;   
  6.     overflowauto;   
  7. }  

样例图片:

CSS3的resize属性使用初探

HTML / CSS 相关文章推荐
纯CSS3代码实现switch滑动开关按钮效果
Aug 30 HTML / CSS
利用CSS的Sass预处理器(框架)来制作居中效果
Mar 10 HTML / CSS
纯CSS绘制漂亮的圆形图案效果
May 07 HTML / CSS
CSS3实现可爱的小黄人动画
Jul 11 HTML / CSS
CSS3属性 line-clamp控制文本行数的使用
Mar 19 HTML / CSS
css3利用transform变形结合事件完成扇形导航
Oct 26 HTML / CSS
详解CSS3:overflow属性
Nov 17 HTML / CSS
HTML5本地存储之Database Storage应用介绍
Jan 06 HTML / CSS
详解HTML5中div和section以及article的区别
Jul 14 HTML / CSS
完美解决IE8下不兼容rgba()的问题
Mar 31 HTML / CSS
AmazeUI在模态框中嵌入表单形成模态输入框
Aug 20 HTML / CSS
CSS3 天气图标动画效果
Apr 06 HTML / CSS
基于html和CSS3制作酷炫的导航栏
Sep 23 #HTML / CSS
基于CSS3实现的黑色个性导航菜单效果
Sep 14 #HTML / CSS
基于CSS3实现的漂亮Menu菜单效果代码
Sep 10 #HTML / CSS
实例讲解使用CSS实现多边框和透明边框的方法
Sep 08 #HTML / CSS
使用CSS3配合IE滤镜实现渐变和投影的效果
Sep 06 #HTML / CSS
基于css3的属性transition制作菜单导航效果
Sep 01 #HTML / CSS
CSS3实现银灰色动画效果的导航菜单代码
Sep 01 #HTML / CSS
You might like
PHILIPS D1835/D1875的电路分析与打理
2021/03/02 无线电
香妃
2021/03/03 冲泡冲煮
php adodb介绍
2009/03/19 PHP
利用Ffmpeg获得flv视频缩略图和视频时间的代码
2011/09/15 PHP
php连接mssql的一些相关经验及注意事项
2013/02/05 PHP
简单说说PHP优化那些事(经验分享)
2014/11/27 PHP
PHP使用Curl实现模拟登录及抓取数据功能示例
2018/04/27 PHP
php设计模式之观察者模式实例详解【星际争霸游戏案例】
2020/03/30 PHP
Jquery.addClass始终无效原因分析
2013/09/08 Javascript
Javascript学习笔记之 函数篇(一) : 函数声明和函数表达式
2014/06/24 Javascript
jquery实现的缩略图预览滑块实例
2015/06/25 Javascript
js 能实现监听F5页面刷新子iframe 而父页面不刷新的方法
2016/11/09 Javascript
javascript学习之json入门
2016/12/22 Javascript
jQuery Form表单取值的方法
2017/01/11 Javascript
从零开始学习Node.js系列教程二:文本提交与显示方法
2017/04/13 Javascript
Vue AST源码解析第一篇
2017/07/19 Javascript
原生JS实现轮播图效果
2018/10/12 Javascript
jquery获取img的src值实例介绍
2019/01/16 jQuery
vue中beforeRouteLeave实现页面回退不刷新的示例代码
2019/11/01 Javascript
es6中class类静态方法,静态属性,实例属性,实例方法的理解与应用分析
2020/02/15 Javascript
[00:20]DOTA2荣耀之路7:-ah fu-抢盾
2018/05/31 DOTA
[01:02:07]Liquid vs Newbee 2019国际邀请赛小组赛 BO2 第一场 8.15
2019/08/16 DOTA
Python下实现的RSA加密/解密及签名/验证功能示例
2017/07/17 Python
Python Json模块中dumps、loads、dump、load函数介绍
2018/05/15 Python
python 常用的基础函数
2018/07/10 Python
详解python里的命名规范
2018/07/16 Python
Python 字符串换行的多种方式
2018/09/06 Python
Django重设Admin密码过程解析
2020/02/10 Python
用Python实现职工信息管理系统
2020/12/30 Python
Java面试题:说出如下代码的执行结果
2015/10/30 面试题
一名毕业生的自我鉴定
2013/12/04 职场文书
转党组织关系介绍信
2014/01/08 职场文书
农村党支部书记司法四风问题对照检查材料
2014/09/26 职场文书
党支部创先争优公开承诺书
2015/04/30 职场文书
七年级思品教学反思
2016/02/20 职场文书
物业管理交接协议书
2016/03/24 职场文书