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实现超炫的loading加载动画效果
May 07 HTML / CSS
实例教程 纯CSS3打造非常炫的加载动画效果
Nov 05 HTML / CSS
使用css3实现的windows8开机加载动画
Dec 09 HTML / CSS
CSS3实现酷炫的3D旋转透视效果
Nov 21 HTML / CSS
借助HTML5 Canvas来绘制三角形和矩形等多边形的方法
Mar 14 HTML / CSS
HTML5网页音乐播放器的示例代码
Nov 09 HTML / CSS
教你如何一步一步用Canvas写一个贪吃蛇
Oct 22 HTML / CSS
HTML5 语音搜索只需一句代码
Jan 03 HTML / CSS
整理HTML5中支持的URL编码与字符编码
Feb 23 HTML / CSS
关于解决iframe标签嵌套问题的解决方法
Mar 04 HTML / CSS
canvas实现手机的手势解锁的步骤详细
Mar 16 HTML / CSS
CSS极坐标的实例代码
Jun 03 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
source.php查看源文件
2006/12/09 PHP
PHPMailer安装方法及简单实例
2008/11/25 PHP
请离开include_once和require_once
2013/07/18 PHP
PHP未登录自动跳转到登录页面
2016/12/21 PHP
laravel中短信发送验证码的实现方法
2018/04/25 PHP
阿里对象存储OSS在laravel框架中的使用方法
2019/10/13 PHP
php使用自带dom扩展进行元素匹配的原理解析
2020/05/29 PHP
JS中自定义定时器让它在某一时刻执行
2014/09/02 Javascript
jQuery中parents()方法用法实例
2015/01/07 Javascript
JavaScript中var关键字的使用详解
2015/08/14 Javascript
Node.js的MongoDB驱动Mongoose基本使用教程
2016/03/01 Javascript
js实现文字滚动效果
2016/03/03 Javascript
Angular2 多级注入器详解及实例
2016/10/30 Javascript
javascript基于原型链的继承及call和apply函数用法分析
2016/12/15 Javascript
JS绘制微信小程序画布时钟
2016/12/24 Javascript
JS字符串统计操作示例【遍历,截取,输出,计算】
2017/03/27 Javascript
JavaScript该如何学习 怎样轻松学习JavaScript
2017/06/12 Javascript
vue实现tab切换外加样式切换方法
2018/03/16 Javascript
基于Vue 2.0 监听文本框内容变化及ref的使用说明介绍
2018/08/24 Javascript
基于JS抓取某高校附近共享单车位置 使用web方式展示位置变化代码实例
2019/08/27 Javascript
原生js实现下拉框选择组件
2021/01/20 Javascript
用Python制作检测Linux运行信息的工具的教程
2015/04/01 Python
使用Python编写爬虫的基本模块及框架使用指南
2016/01/20 Python
[原创]pip和pygal的安装实例教程
2017/12/07 Python
详解python持久化文件读写
2019/04/06 Python
给大家整理了19个pythonic的编程习惯(小结)
2019/09/25 Python
微软澳洲官方网站:Microsoft Australia
2017/01/10 全球购物
不同浏览器创建XMLHttpRequest方法有什么不同
2014/11/17 面试题
七一党建活动方案
2014/01/28 职场文书
国际贸易毕业生求职信范文
2014/02/21 职场文书
读书月活动方案
2014/05/22 职场文书
2014年社区工作总结
2014/11/18 职场文书
2015年学习部工作总结范文
2015/03/31 职场文书
2015秋季开学典礼新闻稿
2015/07/17 职场文书
结婚主持人致辞
2015/07/28 职场文书
幼儿园托班教育随笔
2015/08/14 职场文书