resize属性
为了增强用户体验,CSS3增加了相当新的属性,其中之一就是resize,它允许用户通过拖动来改变元素的大小。到目前为止,它主要用在任何可以使用overtflow属性的容器元素中。
调整大小:无|水平|垂直|继承
无:浏览器不提供尺寸修剪机制,用户无法操作该机制调整的高度和宽度。
两者:浏览器提供了双向调整大小的机制,允许用户调整元素的宽度和高度。
水平:浏览器提供单向水平调整机制,允许用户调整元素的宽度。
垂直:浏览器提供单向垂直调整机制,允许用户调整元素的高度。
目前除了IE浏览器,其他最新的主流浏览器都允许元素缩放,但还没有完全支持。
!DOCTYPEhtml
htmllang='en '
头
metachartset=' UTF-8 '
元名称=“视口”内容=“宽度=设备宽度,初始比例=1.0”
meta http-equiv=' X-UA-Compatible ' content=' ie=edge '
标题文档/标题
/head
身体
风格。方框{
盒子大小:边框盒子;
-web kit-box-sizing : border-box;
border:3pxsolidgreen
}。p{
宽度:10 px;
高度:20 px;
border:1emsolidblack
resize:both
飞越: auto;
/*溢出和redize必须同时定义,否则redize属性声明无效,元素溢出默认显示可见*/*/
box-size : initial;
}
/style
divclass='p '
你好,世界
/div
divclass='box '
你好,世界/p
/div
脚本
/script
/body
/html
CSS设置
本文的操作环境:Windows7系统,HTML5CSS3第三版,DellG3电脑。
Resize是CSS3中的一个特性,用于指定用户是否调整元素的大小。
css3设计功能。
函数:指定用户是否可以调整元素大小。
说明:火狐、Chrome和Safari支持调整大小功能。
语法:
一个
resize:none | both |水平|垂直;
无:用户无法调整元素的大小。
两者:用户可以调整元素的高度和宽度。
水平:用户可以调整元素的宽度。
垂直:用户可以调整元素的高度。
注意:如果你想让这个特性生效,你需要设置元素的溢出特性。该值可以是自动、隐藏或滚动。
css3resize特性示例。
调整大小功能指定用户是否可以调整元素大小。
注意:Firefox4、Safari和Chrome支持调整大小功能。
内容来源网络,如有侵权,联系删除,本文地址:https://www.230890.com/zhan/57687.html