resize属性可以设置是否允许用户缩放网页中元素的大小

总共有4种取值

none

vertical

horizontal

both

举个栗子

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>resize</title>

<style type="text/css">

#resize {

    background:url(images/img19.jpg) no-repeat center;

    -moz-background-clip:content;

    -webkit-background-clip:content;

    background-clip:content;

    width:200px;

    height:120px;

    max-width:800px;

    max-height:600px;

    padding:6px;

    border: 1px solid red;

    resize: both;

    overflow: auto;

}

</style>

</head>

<body>

<div id="resize"></div>

</body>

</html>

记得定义最大尺寸，把缩放控制在一定范围之内。

CSS3实战之resize的更多相关文章

  1. 《css3实战》读书笔记 第一章 基于CSS需求而编写的HTML.

    笔记说明 <CSS3实战手册第3版(影印版)>可以消除Web设计工作的痛苦,并且带给你:HTML--重新入门.如果你是HTML新手,你会学到如何以CSS友好的方式进行基本页面构造.若你是H ...

  2. CSS3实战手册(第3版)(影印版)

    <CSS3实战手册(第3版)(影印版)> 基本信息 原书名:CSS3: The Missing Manual, 3E 作者: David Sawyer McFarland 出版社:东南大学 ...

  3. CSS3实战开发 表单发光特效实战开发

    首先,我们先准备好html代码: <!doctype html> <html> <head> <meta charset="utf-8"& ...

  4. CSS3实战开发:使用CSS3实现photoshop的过滤效果

    原文:CSS3实战开发:使用CSS3实现photoshop的过滤效果 我们知道,使用Photoshop来调整图像的亮度和对比度,或者将图片转化为灰度等等是很常见的功能.今天我将给大家介绍几个新特性,我 ...

  5. CSS3实战开发: 纯CSS实现图片过滤分类显示特效

    原文:CSS3实战开发: 纯CSS实现图片过滤分类显示特效 各位网友大家好,今天我要带领大家开发一个纯CSS的图片分类显示的网址导航,单纯看标题大家可能有些困惑,依照以往惯例,我先给大家演示一下实际运 ...

  6. CSS3实战开发: 折角效果实战开发

    <!DOCTYPE html> <html> <head> <meta charset="utf-9"> <meta name ...

  7. 160427、CSS3实战笔记--多列布局

    通过阅读和学习书籍<CSS3实战>总结 <CSS3实战>/成林著.—北京机械工业出版社2011.5   多列布局适合纯文字版式设计,如报纸内和杂志类网页布局,不适合做网页结构布 ...

  8. 【01】《响应式Web设计：HTML5和CSS3实战》

    [01]   (魔芋:已看完.) [01]<响应式Web设计:HTML5和CSS3实战>(全).pdf 共246页.   2013年1月出版.   读后感:适合入门的书籍,对于响应式布局, ...

  9. 《响应式Web设计—HTML5和CSS3实战》 学习记录

    作者:Ben Frain 学习时间   2016/5/12 第一章   设计入门 *视口调试工具 IE:Microsoft Internet Explorer Develop Toolbar Safa ...

随机推荐

  1. C语言中Union类型的使用方法

    转自:http://blog.csdn.net/feimor/article/details/6858103 使用C语言时,常常使用struct,对于union类型却几乎没有用过,只知道它是联合类型, ...

  2. pygame学习笔记（1）——安装及矩形、圆型画图

    pygame是一个设计用来开发游戏的python模块,其实说白了和time.os.sys都是一样的东东.今天开始正式学习pygame,下载地址:www.pygame.org.下载后安装完成即可,在py ...

  3. [知乎]老狼:UFS VS NVMe

    https://zhuanlan.zhihu.com/p/26652622 最近某手机厂商的闪存门在知乎上被人踢爆,在所谓“爵士水军”和“友商水军”的口水大战中,至少eMMC, UFS等火星名词被广泛 ...

  4. jmeter发送json数据，报405、400错误解决方案

    1.405错误解决方案:添加HTTP信息头管理器(错误因数:发送格式未设置) 2.400错误解决方案:json文本格式有误(注意:换行.空格等)解决方案:对照json文本数据(错误因数:发送的json ...

  5. TortoiseSVN使用svn+ssh协议连接服务器时重复提示输入密码

    当使用svn+ssh协议连接svn服务器时,ssh会提示请求认证,由于不是svn客户端程序来完成ssh的认证,所以不会缓存密码. 而svn客户端通常会建立多个版本库的连接,当密码没有缓存的时候,就会重 ...

  6. JAVA LOG4J使用方法

    首先,需要在项目中导入log4j使用的JAR包,导入结果如下图: 菜单:Build Path->Configure Build Path->Add Extern Jars 导入JAR包后, ...

  7. BZOJ 1283: 序列

    1283: 序列 Time Limit: 10 Sec  Memory Limit: 162 MBSubmit: 272  Solved: 151[Submit][Status][Discuss] D ...

  8. 洛谷 P2144 [FJOI2007]轮状病毒

    P2144 [FJOI2007]轮状病毒 题目描述 轮状病毒有很多变种.许多轮状病毒都是由一个轮状基产生.一个\(n\)轮状基由圆环上\(n\)个不同的基原子和圆心的一个核原子构成.\(2\)个原子之 ...

  9. kibana5画图

    先展示一下我的Dashboard 1.Markdown文本 2.日志条数统计 3.访问IP前10柱状图 4.访问IP前10饼图 5.状态码饼图 6.状态码趋势图 7.状态码柱状叠加图 8.流量趋势图 ...

  10. Spring MVC使用Cors实现跨域

    在开发APP过程中,APP调用后端接口有跨域的问题,只要在spring-mvc.xml 文件中加入下面的配置即可: <!-- 解决API接口跨域问题配置 Spring MVC 版本必须是 4.2 ...