CSS3新增了resize属性,该属性允许用户通过拖动的方式来修改元素的尺寸。本来resize应该翻译为缩放,但在实际测试中通过resize属性只可以在宽高基础上实现拉伸效果,而无法实现缩放到小于宽高的效果。

  [注意]IE浏览器不支持resize属性

resize

  resize与overflow关系紧密,只有当元素的overflow属性值不是visible时,resize才会起作用

  [注意]因为文本框本身就具有overflow:auto的属性,所以自带resize属性

  值: none | both | horizontal | vertical

  初始值: none

  应用于: 块级元素、替换元素、表单元格

  继承性: 无

none: 用户无法调整元素尺寸
both: 用户可调整元素的宽度和高度
horizontal: 用户只可调整元素的宽度
vertical: 用户只可调整元素的高度

  [注意]在win7下resize拖拽区域的大小是17px*17px,实际上它就是滚动条尺寸

CSS拉伸resize的更多相关文章

  1. CSS: The resize Property

    用户手动调节输入框样式: <!DOCTYPE html> <html> <head> <style> div { border: 2px solid; ...

  2. CSS学习目录

    前面的话 CSS是前端工程师的基本功,但好多执迷于学习javascript的人的基本功并不扎实.可能一些人从w3school网站匆匆过了一遍,只是对CSS常用概念有一些表面上的理解,就一头扎进java ...

  3. CSS 奇思妙想 | 使用 resize 实现强大的图片拖拽切换预览功能

    本文将介绍一个非常有意思的功能,使用纯 CSS 利用 resize 实现强大的图片切换预览功能.类似于这样: 思路 首先,要实现这样一个效果如果不要求可以拖拽,其实有非常多的办法. 将两张图片叠加在一 ...

  4. 学习CSS 笔记

    1.动态修改div的大小 Html: <div> Hello </div> css: div { resize:both; overflow:auto; } 2. box-si ...

  5. 使用CSS禁止textarea调整大小功能的方法

    这篇文章主要介绍了使用CSS禁止textarea调整大小功能的方法,禁止可以调整textarea大小功能的方法很简单,使用CSS的resize属性即可,需要的朋友可以参考下 如果你使用谷歌浏览器或火狐 ...

  6. CSS 随笔

    1.动态修改div的大小 Html: <div> Hello </div> css: div { resize:both; overflow:auto; } 2. box-si ...

  7. 认识CSS中高级技巧之用户界面样式

    前端之HTML,CSS(九) CSS高级技巧 CSS用户界面样式 用户界面样式指更改用户操作样式,如更改用户的鼠标样式.表单轮廓等. 鼠标样式cursor cursor属性具有属性值有:default ...

  8. H5 表单标签

    33-表单标签3 列表数据 注意点: 1.下拉列表不能输入内容, 但是可以直接在列表中选择内容 2.可以通过给option标签添加一个selected属性来指定列表的默认值 3.可以通过给option ...

  9. HTML基础【5】:表单标签

    表单标签 作用:用于收集用户信息,让用户填写.选择相关信息 格式: <from> 表单标签 </from> 注意事项: 所有的表单内容,都要写在form标签里面 form标签中 ...

随机推荐

  1. oracle根据视图删除表

    delete from t_fwaqjcjl where zcbm in (select zcbm from view_fwaqjcjl where 1=1 )

  2. bootstrap双日历插件实例化

    网站中难免会用到日期选择插件,常见的有jquery的,也有bootstrap的.单日历的就不说了,实例化都比较简单.今天给大家介绍一下bootstrap的双日历插件. http://www.jq22. ...

  3. SDK接入(U8SDK)——SDK抽象层的设计

    上一篇文章,我们总体地分析并设计了一套高效的SDK接入方案,也罗列出这套方案,我们需要完成的工作.这里再罗列并回顾下: 1.统一抽象的SDK接入框架 2.各个SDK接入实现 3.一键打包工具 4.统一 ...

  4. [后端人员耍前端系列]KnockoutJs篇:快速掌握KnockoutJs

    一.引言 之前这个系列文章已经介绍Bootstrap.由于最近项目中,前端是Asp.net MVC + KnockoutJs + Bootstrap来做的.所以我又重新开始写这个系列.今天就让我们来看 ...

  5. Java设计模式10:观察者模式

    观察者模式 观察者模式也叫作发布-订阅模式,也就是事件监听机制.观察者模式定义了一种一对多的依赖关系,让多个观察者对象同时监听某一个主题对象,这个主题对象在状态上发生变化时,会通知所有观察者对象,使他 ...

  6. git 合并分支

    当前git有PreRelease和Release两个分支,现在需要将前者合并到后者. Clone版本 在本地clone一个目标工程. 然后右键 Tortoise-->Switch/Checkou ...

  7. [.net 面向对象编程基础] (23) 结束语

    [.net 面向对象编程基础] (23)  结束语 这个系列的文章终于写完了,用了半个多月的时间,没有令我的粉丝们失望.我的感觉就是一个字累,两个字好累,三个字非常累.小伙伴们看我每篇博客的时间就知道 ...

  8. jQuery弹出层插件popbox

    都什么年代了,还自己写弹出层插件!是的,①自己写的自己好控制②可定制性高③兼容低版本IE 本插件有以下特性: 样式分离,可定制,纯净无图片 可自定义按钮及按钮的样式.点击事件 可指定选择器选择页面元素 ...

  9. 在.net中使用aquiles访问Cassandra(一)

    aquiles是.net下基于Thrift协议访问Cassandra的第三方类库,官方地址是: http://aquiles.codeplex.com/   1.下载类库文件: http://aqui ...

  10. Asp.net MVC JsonResult 忽略属性

    指定 JavaScriptSerializer 不序列化公共属性或公共字段.无法继承此类. 命名空间:  System.Web.Script.Serialization 程序集:  System.We ...