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. 【第十周】psp

    代码累计 300+575+475+353+620+703=2926 随笔字数 1700+3000+3785+4210+4333+3032=20727 知识点 机器学习,支持向量机 数据库技术 Acm刷 ...

  2. SEO优化之HTML代码优化最重要的5个标签

    众所周知,HTML代码一直是搜索引擎抓取的重点.搜索引擎会将HTML中的某些元素标签作为影响网页排名的重要依据 在我们之前的文章中也或多或少地向大家介绍了有关HTML代码的优化技巧,接下来将系统地讲解 ...

  3. Python面向对象高级编程：__slot__(给实例添加方法、属性)

    纲要: 本章总的来说是给实例添加属性,给类添加方法两个主题,以及相应的作用范围.总结如下: 1.给实例添加属性(作用范围:当然是只对当前实例有效): 2.用__slots__限制可以给实例添加的属性( ...

  4. There is no getter for property named 'notice' in 'class com.game.domain.Notices'

    在插入数据时报错:There is no getter for property named 'notice' in 'class com.game.domain.Notices' 四月 11, 20 ...

  5. Redis 基础：Redis 数据类型

    Redis 数据类型 Redis支持五种数据类型:string(字符串).hash(哈希).list(列表).set(集合)及zset(sorted set:有序集合). String(字符串) st ...

  6. BZOJ3289 Mato的文件管理（莫队+树状数组）

    这个做法非常显然. #include<iostream> #include<cstdio> #include<cmath> #include<cstdlib& ...

  7. R2学习记录

    Setting up the Libevent library1.重写log行为 #include <event2/event.h> #include <stdio.h> st ...

  8. Vue 中使用UEditor富文本编辑器-亲测可用-vue-ueditor-wrap

    其中UEditor中也存在不少错误,再引用过程中. 但是UEditor相对还是比较好用的一个富文本编辑器. vue-ueditor-wrap说明 Vue + UEditor + v-model 双向绑 ...

  9. 【POJ2411】Mondriaan's Dream（轮廓线DP）

    [POJ2411]Mondriaan's Dream(轮廓线DP) 题面 Vjudge 题解 这题我会大力状压!!! 时间复杂度大概是\(O(2^{2n}n^2)\),设\(f[i][S]\)表示当前 ...

  10. Linux系统中/opt 和 /usr目录

    重点:usr是Unix Software Resource的缩写,即“UNIX操作系统软件资源”所放置的目录. 下面是个人找到的适合类似我这种从Windows转向Linux小白的文章. Ref:htt ...