哎,老了之display-box
哎,不想吐槽自己了,表示已远远落后,从今天起开始恶补吧,来一个实例
<html>
<head>
<meta name="generator"
content="HTML Tidy for HTML5 (experimental) for Windows https://github.com/w3c/tidy-html5/tree/c63cc39" />
<title></title>
<style>
*{
margin:0px;
padding:0px;
}
.test{
width:700px;
height:200px;
display:-moz-box;
display:-webkit-box;
display:box;
}
.test div{ background:green;
margin-right:20px;
}
.test div:first-child{
-moz-box-flex:2;
-webkit-box-flex:2;
}
.test div:nth-child(2){
-moz-box-flex:3;
-webkit-box-flex:3;
}
.test div:nth-child(3){
-moz-box-flex:3;
-webkit-box-flex:3;
}
</style>
</head>
<body>
<div class="test">
<div></div>
<div></div>
<div></div>
</div>
</body>
</html>
哎,老了之display-box的更多相关文章
- display:box和display:inline-box的区别
display:box我想大家很熟悉,那么display:inline-box呢,今天在项目中需要设置这样的属性box-align:center,那么就想到用 display:box;如果设置BOX, ...
- CSS3 display:flex和display:box有什么区别?
**区别**,仅是各阶段草案命名.- W3C 2009年第1次草案:[display:box;](https://www.w3.org/TR/2009/WD-css3-flexbox-20090723 ...
- display:box;display:flex;弹性盒模型
display:box:display:flex:弹性盒模型 非常适用于移动端.PC端高级浏览器,效果也很好. display: -webkit-box; display: -moz-box; dis ...
- display:box属性
在移动端开发的时候,圣杯布局,弹性盒,是我们经常会用得到的,W3C很久以前就有一个display:box属性 flex是最新的,但是在实际的浏览器测试中,display: flex 不能完全替代dis ...
- CSS3盒模型display:box;box-flex:3;
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name ...
- 关于display: box 和 box-flex
这两天做手机项目,使用到这个css3新属性.现在还不为所有浏览器支持,所以使用的时候要加上前缀.使用方法见下面: html代码: <div class="s-indLine" ...
- 被废了的display:box弹性盒模型
这几天在研究弹性布局,看书中写的是display:box,结果在chrome浏览器中是正常的,想着移动端大部分浏览器也是webkit内核的应该也没啥问题,结果确实没问题,但仔细一看,高度呢?好吧,严重 ...
- CSS3盒模型display初探(display:box/display:flex)
可以实现水平等分切割等.日后在研究,做个记录. 首先要声明:display:box,像谷歌浏览器要加前缀识别码:display:-webkit-box; 然后才开始使用其属性,同时也是要带上前缀识别码 ...
- CSS3.0盒模型display:box;的使用
CSS3.0盒模型display:-webkit-box;的使用 box-flex是css3新添加的盒子模型属性,它的出现可以解决我们通过N多结构.css实现的布局方式.经典的一个布局应用就是布局的垂 ...
- CSS3盒模型display:box详解
display:box;box-flex是css3新添加的盒子模型属性,它的出现可以解决我们通过N多结构.css实现的布局方式.经典的一个布局应用就是布局的垂直等高.水平均分.按比例划分. 目前box ...
随机推荐
- (九)DVWA之SQL Injection--SQLMap&Fiddler测试(High)
一.测试需求分析 测试对象:DVWA漏洞系统--SQL Injection模块--ID提交功能 防御等级:High 测试目标:判断被测模块是否存在SQL注入漏洞,漏洞是否可利用,若可以则检测出对应的数 ...
- input常用限制
1.自动过滤空格 onkeyup="this.value=this.value.replace(/^ +| +$/g,'')" onafterpaste="this.va ...
- [转] linux操作系统下c语言编程入门--基础知识
点击阅读原文 这篇文章介绍在LINUX下进行C语言编程所需要的基础知识.在这篇文章当中,我们将会学到以下内容: 1. 源程序编译 2. Makefile的编写 3. 程序库 ...
- Git创建多个ssh key
在使用git的时候,遇到需要创建多个ssh key的需求,一个用来git hub项目,一个用来git lab项目: 之前如果已将创建过一个ssh key,那么在创建第二个的时候,要修改默认名称,然后增 ...
- vim中的替换操作
在vim中 :s(substitute)命令用于查找并替换字符串.使用方法如下: :s/<find-this>/<replace-with-this>/<flags> ...
- 使用vuex中的store存储数据
Vuex是一个专门为Vue.js应用程序开发的状态管理模式,这个状态自管理应用包括三个模式 state 驱动应用的数据源 view 以声明方式将state映射到视图 actions 响应在view上的 ...
- ImportError: cannot import name _remove_dead_weakref
出现这个错误, 和python环境有关. 电脑有多个版本造成的. python3 有这个_remove_dead_weakref python 2.7.10 并没有_remove_dead_weakr ...
- Docker Dockerfile 指令详解与实战案例
Dockerfile介绍及常用指令,包括FROM,RUN,还提及了 COPY,ADD,EXPOSE,WORKDIR等,其实 Dockerfile 功能很强大,它提供了十多个指令. Dockerfile ...
- Redis:rdb和aof
由于redis的数据都直接存储在内存里,在服务器发生宕机时内存的数据会瞬间清空,那么必须要有重启时恢复数据的方法. redis通过持久化机制将数据存储到磁盘中从而在服务器重启时恢复数据,这篇文章主要简 ...
- Python3-random模块-生成伪随机数
Python3中的random模块可以生成一个伪随机数 常用的就三个模块函数 random.random() 返回0-1之间的一个随机数 random.randrange(i, j) 返回一个随机数 ...