<div class="div1">
<div class="box">
<div>A</div>
<div>B</div>
<div>C</div>
<div>D</div>
</div>
</div>
.div1 .box {
border: 1px solid #ccc;
padding: 10px;
display: -moz-box;
display: -webkit-box;
display: box;
}
.div1 .box>div {
border: 1px solid #f36;
height: 100px;
text-align: center;
-webkit-box-flex:;
-moz-box-flex:;
-ms-flex:;
-o-box-flex:;
box-flex:;
}

我用flex发现有些安卓手机不好使用,所以把没有测出BUG的box上传了

DIV伸缩盒子box的更多相关文章

  1. HTML+CSS基础 border css属性 Div块 盒子

    border  css属性 边框颜色 border-color:red/#ffffff/rgb()默认为黑色 边框样式 border-style:solid (实线) dashed (虚线).默认为n ...

  2. 三栏布局,div左右盒子是定宽,中间是自适应

    用弹性布局flex: 给父盒子加个display:flex; 给中间盒子设flex=1; /* 弹性盒子布局*/ .wrap{ width: 100%; height: 90px; display: ...

  3. div介绍 盒子模型边框属性 CSS初始化 文字排版 边框调整 溢出

    今天学习的div,了解了div是干什么用的掌握了什么是盒子模型,以及div的外边距内边距以及边框,运用div和CSS给文字排版,利用边框的来做图像,div溢出的处理 CSS初始化: 精确排版的时候用这 ...

  4. DIV + CSS 盒子模型

    盒子模型有两种,分别是 IE 盒子模型和标准 W3C 盒子模型.他们对盒子模型的解释各不相同, 先来看看我们熟悉的标准盒子模型: 图片看不清楚?请点击这里查看原图(大图). 从上图可以看到标准 W3C ...

  5. h5-携程页面小案例-伸缩盒子

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. 伸缩盒子模型,旧的伸缩盒子模型。浏览器内核、css继承属性

  7. flex 伸缩盒子

    flex 的学习地址: http://caibaojian.com/demo/flexbox/align-content.html

  8. 前端 HTML body标签相关内容 常用标签 盒子标签 div

    盒子标签 div <div>可定义文档的分区 division的缩写 译:区 <div> 标签可以把文档分割为独立的.将他们进行分区 div在浏览器中,默认是不会增加任何的效果 ...

  9. css弹性盒子学习

    css3弹性盒子是一种布局方式,在适应不同的屏幕大小的时候,能够确保元素拥有更恰当的排布行为.它只是视觉呈现上的,即显示顺序适应显示空间,与源代码无关,源代码顺序不受影响. 定义一个弹性盒子: 在cs ...

随机推荐

  1. ls常用选项总结

    参考: http://billie66.github.io/TLCL/book/index.html ls - List directory contents 选项 长选项 描述 -a --all 列 ...

  2. 1.把二元查找树转变成排序的双向链表[BST2DoubleLinkedList]

    [题目]:输入一棵二元查找树,将该二元查找树转换成一个排序的双向链表.要求不能创建任何新的结点,只调整指针的指向. 比如将二元查找树 . 10 / \ 6 14 / \ / \ 4 8 12 16 转 ...

  3. windows hosts

    2015年6月29日 11:10:56 星期一 windows 的 hosts 文件生效机制 以最前边的为准, 重复的硬解析只有第一次出现的地方生效

  4. MySQL中无GROUP BY直接HAVING的问题【转】

    本文来自网址: http://www.penglixun.com/tech/database/having_without_groupby_in_mysql.html 今天有同学给我反应,有一张表,i ...

  5. 配置IIS,Apache,PHP过程中遇到的一些问题

    下载了eclipse的最新版本,并且添加了PHP插件.为了支持多语言,决定采用UTF-8编码.但是在开发的过程中,发现代码的自动提示帮助信息显示的是乱码,PHP源文件及注释,均正常.在网上查了很多资料 ...

  6. 从inet_pton()看大小端字节序

    #include<stdio.h> #include<netinet/in.h> #include<stdlib.h> #include<string.h&g ...

  7. 谷歌 Uncaught SecurityError: Failed to execute 'replaceState' on 'History 错误

    今天在用sui mobil做一个内联页面的时候遇到了这个问题. 然而这个问题只出现在chrome浏览器中,在火狐中没有一点问题. 他说明的是一个安全问题,chrome中有了新的安全机制

  8. 将file转变成contenthash

    一.将MultipartFile转file CommonsMultipartFile cf= (CommonsMultipartFile)file; DiskFileItem fi = (DiskFi ...

  9. java获取手机号归属地

    import java.io.BufferedReader; import java.io.IOException; import java.io.InputStreamReader; import ...

  10. html与js传json值给php

    //一段js代码 var data = {}, act = [], list = []; $('.set').find('input, textarea').each(function() { act ...