本实例代码可以使DIV可以手动改变大小

效果体验：http://hovertree.com/code/css/resize.htm

代码如下：

<!DOCTYPE html>

<html>

<head><title>何问起</title><base target="_blank" />

<style>

div

{

background-color:#f0f0f0;

border:solid red 1px;

padding:10px 40px;

width:300px;

resize:both;

overflow:auto;

}

</style>

</head>

<body>

<div>resize 属性规定是否可由用户调整元素尺寸 - 何问起</div>

<p><b>注释：</b> Firefox 4+、Safari 以及 Chrome 支持 resize 属性。</p>

<a href="http://hovertree.com/h/bjaf/css3_resize.htm">参考</a>

<a href="http://hovertree.com/code/css/resize.htm">本文地址</a>

</body>

</html>

参考：css3的resize属性

更多特效：http://www.cnblogs.com/jihua/p/webfront.html

CSS手动改变DIV高宽的更多相关文章

  1. css挖坑爬坑之div高宽相等

    目标效果 对于这么一个头像,外面是一个圆角的div里面是一个img,对于外面的div我要使他高度等于宽度. 发现问题 开始的时候设置宽度为100%然后高度为100%,这样子对于宽度来说的话可以撑满页面 ...

  2. css如何将div画成三角形

    首先了解一下盒模型: 盒模型 先看一段代码: #div1{ height: 100px; border-style: solid; border-width: 100px 100px 100px 10 ...

  3. 移动端 css实现自适应正圆 ( 宽高随着手机屏幕宽度自适应 )

    序言:应朋友要求随手写了一下移动端 css实现自适应正圆 ( 宽高随着手机屏幕宽度自适应 ) ,以备后用 LESS代码: .adaptive-circle { margin: 50px auto 0; ...

  4. table 与 div 固定宽高问题

    div {width:100px;height:200px;word-wrap: break-word;overflow:hidden;} 这个可以固定div的宽高,溢出内容会被剪除. table{t ...

  5. div 固定宽高 水平垂直居中方法

    div固定宽高,水平垂直居中,根据所用单位不同,分成两种情况,分别是"px"和"%"情况. 例:将三层div做出三个边框,要求水平垂直居中.效果如图 情况一(单 ...

  6. css3之transform属性实现div不定宽高垂直水平居中

    transform的作用 transform 属性向元素应用 2D 或 3D 转换.该属性允许我们对元素进行旋转.缩放.移动或倾斜.(w3cschool) transform的兼容性 transfor ...

  7. css实现保持div的等宽高比

    这篇文章主要为回答这个问题:“做响应式网页,如何让一个div的高和宽保持比例放大或是缩小?”,这里不介绍媒体查询的实现. 那么css如何实现高度height随宽度width变化保持比例不变呢?即给定可 ...

  8. css基础之 图片瀑布流布局：用CSS+DIV等宽格子堆砌瀑布流效果 （一）

    <!doctype html> <html> <head> <meta charset="UTF-8"/> <title> ...

  9. 第4天：JS入门-给div设置宽高背景色

    今天学习了js入门课程,听的不多,做了个小练习,给div设置宽高.背景色.一点点都是进步.核心代码如下: <!DOCTYPE html><html lang="en&quo ...

随机推荐

  1. C#设计模式-模板方法模式

    提到模板,大家肯定不免想到生活中的“简历模板”.“论文模板”.“Word中模版文件”等,在现实生活中,模板的概念就是——有一个规定的格式,然后每个人都可以根据自己的需求或情况去更新它,例如简历模板,下 ...

  2. Java final 关键词修饰类、方法、变量

    1. final修饰类  被修饰的类不能被继承,也没有子类.假如随意创建这些类的子类,子类可能会错误的修改父类的实现细节.出于安全原因,类的实现细节不允许有任何改动.在创建对象模型的时候,确信这个类不 ...

  3. Spring学习记录(六)---使用外部属性文件

    在bean配置资源或系统部署,如数据库的连接时,需要这样: 要包含相关jar包:c3p0.jar 和mysql.connector.jar xml配置: <bean id="dataS ...

  4. 用SQL语句创建四个表并完成相关题目-10月18日更新

    1. 查询Student表中的所有记录的Sname.Ssex和Class列. 2. 查询教师所有的单位即不重复的Depart列. 3. 查询Student表的所有记录. 4. 查询Score表中成绩在 ...

  5. Sql Server系列：Transact-SQL变量

    变量是Transact-SQL中由用户定义.可对其赋值并参与运算的一个实体,分为全局变量和局部变量.其中全局变量由系统自定义并维护,全局变量名称前面有@@字符,任何程序均可随时调用.局部变量名称前面有 ...

  6. 【转】如何让你的Android SDK下载或者升级快如闪电

    准备学习Android开发,但是Android SDK Manager界面都刷不出来,今天看到了一篇文章,顿时就解决了,原文地址http://qichaochen.github.io/2014/12/ ...

  7. 前端学PHP之面向对象系列第五篇——对象操作

    × 目录 [1]对象克隆 [2]对象比较[3]对象串行化[4]json 前面的话 本文主要介绍面向对象中的一些对象操作 对象克隆 对象复制,又叫对象克隆,可以通过 clone 关键字来完成 在多数情况 ...

  8. Android随笔之——Android单元测试

    在实际开发中,开发android软件的过程需要不断地进行测试.所以掌握Android的单元测试是极其重要的.您应该把单元测试作为Android应用开发周期的一部分,精心编写的测试可以在开发早起帮你发现 ...

  9. 1Z0-053 争议题目解析470

    1Z0-053 争议题目解析470 考试科目:1Z0-053 题库版本:V13.02 题库中原题为: 470.Which NLS parameter can be used to change the ...

  10. 软件工程-构建之法 Visual Studio开发平台的安装与单元测试

    一.前言 自从开始了大三下的生活,学校开设一门课程“软件工程”,刚好我们是第一届进行课程改革,不在像以前那样背背概念,考前进行好好突击,然后考试就能过,最后毕业了发现软件工程课程到底我们在其中学习了什 ...