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. Introduction ch3

    [1] Don’t reinvent the wheel; use libraries.[2] Don’t believe in magic; understand what your librari ...

  2. shell 记录

    查看进程打开的文件句柄lsof -p 进程号|wc -l date --set "Wed Dec 11 14:51:41 CST 2013" 重启VPN pon vpn arg=` ...

  3. centos 安装 apache2.4

    1. centos 安装 apache2.4 安装基础依赖:# yum install gcc gcc-c++ glibc glibc-devel gd gd-devel zlib zlib-deve ...

  4. Visual Studio 2010中的stdafx.h和targetver.h两个头文件是有什么用?

    来自百度~stdafx.h中没有函数库,只是定义了一些环境参数,使得编译出来的程序能在32位的操作系统环境下运行. Windows和MFC的include文件都非常大,即使有一个快速的处理程序,编译程 ...

  5. Manifesto of the Communist Party

    A spectre is haunting Europe – the spectre of communism. All the powers of old Europe have entered i ...

  6. crtmpserver系列(一):流媒体概述

    概述 所谓流媒体按照字面意思理解就是像流一样的媒体,看起来像是废话.流媒体现在司空见惯,所以一般人大概不会有疑问.事实上在流媒体还没有出现的时候,基本上通过网络播放电影就不太现实.通过网络播放电影的时 ...

  7. 找回忘记的Ubuntu用户名和密码

    找回忘记的Ubuntu用户名和密码 前端时间使用VMWare安装了个Ubuntn的虚拟机,但是烦于安装后显卡驱动的问题,看着操作界面就有点厌烦,就扔下了.今天打开虚拟机登陆的时候忘了密码,寻思着难道要 ...

  8. log4net入门

    简介 几乎所有的大型应用都会有自己的用于跟踪调试的API.因为一旦程序被部署以后,就不太可能再利用专门的调试工具了.然而一个管理员可能需要有一套强大的日志系统来诊断和修复配置上的问题. 经验表明,日志 ...

  9. [教程]怎么用百度云观看和下载"磁力链接"无需下载直接观看.

    1, 打开网址 http://okbt.net/  输入你想要看的电影名字, 点搜索,鼠标右键点击拷贝磁力链接.或者 电脑装了迅雷的话.可以直接点击.用迅雷下载. 磁力链接都是这种格式的.例: mag ...

  10. 【腾讯Bugly干货分享】微信终端跨平台组件 mars 系列(一) - 高性能日志模块xlog

    本文来自于腾讯bugly开发者社区,非经作者同意,请勿转载,原文地址:http://dev.qq.com/topic/57ff5932cde42f1f03de29b1 本文来源: 微信客户端开发团队 ...