<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. ios awakeFromNib 和 initWithCoder:

    During the instantiation process, each object in the archive is unarchived and then initialized with ...

  2. serv-u启动管理控制台后提示脚本错误解决方案

             问题描述: 安装serv-u后打开管理控制台,提示“脚本错误“控制台界面无法正常显示: 解决方法: 1.在serv-u安装目录下找到”Serv-U-DefaultCertificat ...

  3. java 入门 第三季1

    异常和异常体系 java异常体系 throwable:error:线程死锁,内存溢出 excepiton:rumtimeException运行时异常:非检查异常 检查异常:文件异常IOExceptio ...

  4. drupal记录(一)

    翻译包下载网址:locallize.drupal.org 中文模块 local 自动下载模块 L10n_update 第三方menu菜单 admin menu,menu bar 打开这个后要关闭系统自 ...

  5. JS中数组Array的用法示例介绍 (转)

    new Array() new Array(len) new Array([item0,[item1,[item2,...]]] 使用数组对象的方法: var objArray=new Array() ...

  6. 【编程题目】有 n 个长为 m+1 的字符串,如果某个字符串的最后 m 个字符与某个字符串的前 m 个字符匹配...

    37.(字符串)有 n 个长为 m+1 的字符串,如果某个字符串的最后 m 个字符与某个字符串的前 m 个字符匹配,则两个字符串可以联接,问这 n 个字符串最多可以连成一个多长的字符串,如果出现循环, ...

  7. 【文件】读取一个文件夹下所有的jpg图片

    今天做视频处理的时候,发现给的视频是用jpg图片的形式给出的,名字的命名规律性不是很强.就想找一种通用的遍历文件夹下图片的方法. 开始在网上找到了下面这份代码,发现只能读取所有的文件夹,文件都被跳过了 ...

  8. Jquery的鼠标移动上去显示div,鼠标离开的时候隐藏div效果

    有时候我们需要这个效果:当鼠标放上去的时候显示一个div,当鼠标移走的时候就将div隐藏了.代码如下,记得引入Jquyer库.(当鼠标移动到id=menu的div上的时候,显示id=list的div, ...

  9. iOS MD5加密

    1.MD5加密 Message Digest Algorithm MD5(中文名为消息摘要算法第五版)为计算机安全领域广泛使用的一种散列函数,用以提供消息的完整性保护.该算法的文件号为RFC 1321 ...

  10. java中的[Ljava.lang.Object;@2a139a55问题

    数据显示为Ljava.lang.Object;@2a139a55问题,是因为你从数据库读出数据后,存入到list集合上时,如果你没有指定要存入的数据的类型,系统会自动给你赋一个object类型,他是所 ...