CSS拉伸resize
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的更多相关文章
- CSS: The resize Property
用户手动调节输入框样式: <!DOCTYPE html> <html> <head> <style> div { border: 2px solid; ...
- CSS学习目录
前面的话 CSS是前端工程师的基本功,但好多执迷于学习javascript的人的基本功并不扎实.可能一些人从w3school网站匆匆过了一遍,只是对CSS常用概念有一些表面上的理解,就一头扎进java ...
- CSS 奇思妙想 | 使用 resize 实现强大的图片拖拽切换预览功能
本文将介绍一个非常有意思的功能,使用纯 CSS 利用 resize 实现强大的图片切换预览功能.类似于这样: 思路 首先,要实现这样一个效果如果不要求可以拖拽,其实有非常多的办法. 将两张图片叠加在一 ...
- 学习CSS 笔记
1.动态修改div的大小 Html: <div> Hello </div> css: div { resize:both; overflow:auto; } 2. box-si ...
- 使用CSS禁止textarea调整大小功能的方法
这篇文章主要介绍了使用CSS禁止textarea调整大小功能的方法,禁止可以调整textarea大小功能的方法很简单,使用CSS的resize属性即可,需要的朋友可以参考下 如果你使用谷歌浏览器或火狐 ...
- CSS 随笔
1.动态修改div的大小 Html: <div> Hello </div> css: div { resize:both; overflow:auto; } 2. box-si ...
- 认识CSS中高级技巧之用户界面样式
前端之HTML,CSS(九) CSS高级技巧 CSS用户界面样式 用户界面样式指更改用户操作样式,如更改用户的鼠标样式.表单轮廓等. 鼠标样式cursor cursor属性具有属性值有:default ...
- H5 表单标签
33-表单标签3 列表数据 注意点: 1.下拉列表不能输入内容, 但是可以直接在列表中选择内容 2.可以通过给option标签添加一个selected属性来指定列表的默认值 3.可以通过给option ...
- HTML基础【5】:表单标签
表单标签 作用:用于收集用户信息,让用户填写.选择相关信息 格式: <from> 表单标签 </from> 注意事项: 所有的表单内容,都要写在form标签里面 form标签中 ...
随机推荐
- DateTime与DateTime?赋值问题以及null类型的如何赋值问题
解决方案: //主要用到向下兼容原理,DateTime?继承于DateTime: string req = "为字符串的参数"; DateTime? dt = null; Date ...
- php面试题及答案收藏(转)
php面试题及答案收藏(这套试题是在网上看到的,不知作者是谁) 基础题 1.表单中 get与post提交方法的区别? 答:get是发送请求HTTP协议通过url参数传递进行接收,而post是实体数据, ...
- C++多态(一)
面试题目中关于多态的问题不少,例如重载.虚函数(覆盖).多态的概念等等,这里做一个梳理,包含如下内容: 一.多态的定义 (一)定义 能够呈现不同形态的特性或状态. (二)两种多态性 1.编译时的多态性 ...
- 关于Android的背景色配色小结
三基色原理:三基色是指红,绿,蓝三色,人眼对红.绿.蓝最为敏感,大多数的颜色可以通过红.绿.蓝三色按照不同的比例合成产生.同样绝大多数单色光也可以分解成红绿蓝三种色光.这是色度学的最基本原理,即三基色 ...
- 在Python中调用glutInit遇到OpenGL.error.NullFunctionError的解决方法
在window10 64bit + Python环境下,通过pip install PyOpenGL成功之后,无奈执行到glutInit()时候总是报错. OpenGL.error.NullFunct ...
- c语言到汇编的学习
[内存结构] C程序通过编译-汇编-连接,最后到可执行文件.载入内存有这几个部分: text:正文段,存放的是可执行的机器码段 data:存放初始化之后的全局变量和静态变量 bbs:存放未初始化的静态 ...
- Bootstrap CDN推荐
Bootstrap CDN推荐 本站实例采用的是百度的静态资源库(http://cdn.code.baidu.com/)上的Bootstrap资源. 百度的静态资源库的 CDN 服务,访问速度更快.加 ...
- 继续送假期干货——响应式图片工具smartImg
中午看<众妙之门>看到一个响应式图片处理工具(点此查看)的介绍,然后就心血来潮想着不妨自己写一个基于JQ的吧,于是就又有了这么一个干货给大家. smartImg 的全部文件可以从我的Git ...
- Java设计模式2:简单工厂模式
简单工厂模式 简单工厂模式是类的创建模式,又叫做静态工厂方法模式.简单工厂模式由一个工厂对象决定生产出哪一种产品类的实例. 为什么要使用简单工厂模式 原因很简单:解耦. A对象如果要调用B对象,最简单 ...
- 坑爹的BufferManager
特别记录一下 国内外各种关于 Socket 的例子或开源项目,大部分都采用了 BufferManager.cs(代码类似). 也不知道是哪一个坑货写的.有一定几率会导致内存无法复用,导致数据是上一个的 ...