<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
  <style>
    body{
      display: flex;
      align-items: center;
      justify-content: center;
      height: 100vh;
    }
    .aa{
     display: flex;
      align-items: center;
      justify-content: center;
      width: 800px;
      border: 1px;
    }
    .aa>div{
      flex: 0 0 20%;
      margin-left: 5px;
      height: 30px;
      background: red;
      border: 1px solid yellow;
    }
  </style>
</head>
<body>
<div class="aa">
  <div></div>
  <div></div>
  <div></div>
  <div></div>
  <div></div>
</div>

</body>
</html>

C3垂直居中均分的更多相关文章

  1. 水平垂直居中div（css3）

    一.在需要居中的元素加上如下C3属性即可: <!doctype html><html lang="en"><head> <meta cha ...

  2. 一文入门C3

    2.CSS3 官方文档:http://www.w3school.com.cn/cssref/index.asp 2.1.CSS基础 基础简单过下,事先说明下:诸如引入.注释.案例就不一一演示了,有个工 ...

  3. Day5 CSS基本样式和C3选择器

    Day5 CSS基本样式和C3选择器 一.背景属性 1.背景颜色            background-color:transparent(默认值,透明); 颜色的取值:            ...

  4. display：table的几个用法(元素平分宽度，垂直居中)

    DIV+CSS的布局已经让表格布局几乎很少用到,除非表格语义性很强的情况. display:table解决了一部分需要使用表格特性但又不需要表格语义的情况, 尤其是DIV+CSS很不方便解决的问题,比 ...

  5. display：table的几个用法 块级子元素垂直居中

    DIV+CSS的布局已经让表格布局几乎很少用到,除非表格语义性很强的情况. display:table解决了一部分需要使用表格特性但又不需要表格语义的情况, 尤其是DIV+CSS很不方便解决的问题,比 ...

  6. css水平垂直居中 三种最常用的方式

    代码在下面,可以直接用. bb两句,个人见解: text-align 是让里面的内容水平居中 line-height 是行高,行高等于元素的高度 就能让内容垂直居中 left和top 50% 是根据h ...

  7. CSS垂直居中的11种实现方式

    今天是邓呆呆球衣退役的日子,在这个颇具纪念意义的日子里我写下自己的第一篇博客,还望前辈们多多提携,多多指教! 接下来,就进入正文,来说说关于垂直居中的事.(以下这11种垂直居中的实现方式均为笔者在日常 ...

  8. css元素水平居中和垂直居中的方式

    关于居中的问题,一直处于疑惑不解的状态,知道的几种方法好像也不是每一次都会起到作用,所以更加迷惑.主要是不清楚该 在什么情况下采用哪种解决方法,所以,整理了一些方法,梳理一下思路,做一个总结. 1. ...

  9. [css]实现垂直居中水平居中的几种方式

    转自博客 http://blog.csdn.net/freshlover/article/details/11579669 居中方式: 一.容器内(Within Container) 内容块的父容器设 ...

随机推荐

  1. kettel的stream lookup报错

    kettel的stream lookup报错: you can't use the 'integer-pair' algorithm when you have more than one key o ...

  2. LeetCode之“数学”：Plus One

    题目链接 题目要求: Given a non-negative number represented as an array of digits, plus one to the number. Th ...

  3. Myexclipse创建Junit测试

    . 下载JUnit的jar文件,下载地址在这里 2. 在MyEclipse中新建一个要测试的项目HelloJUnit 3. 添加一个要测试的类HelloJUnit,代码如下,注意需要先建package ...

  4. TCP连接建立系列 — 连接请求块

    连接请求块(request_sock)之于TCP三次握手,就如同网络数据包(sk_buff)之于网络协议栈,都是核心的数据结构. 内核版本:3.6 Author:zhangskd @ csdn blo ...

  5. j2ee5.0开发中jstl标签失效

    尝试了下,对于Weblogic中的出现的错误,也是有效的!   j2ee5.0开发中jstl标签失效 原因不详, 解决办法, 一:将.web.xml中 <web-app version=&quo ...

  6. mysql史上最全的学习资料

    Ⅰ.mysql 1.mysql小基础 (1)数据类型 类型 备注 tinyint/smallint/mediumint/int/bigint 1B/2B/3B/4B/8B float/double 单 ...

  7. MySQL/MariaDB中的事务和事务隔离级别

    本文目录:1.事务特性2.事务分类 2.1 扁平事务 2.2 带保存点的扁平事务 2.3 链式事务 2.4 嵌套事务 2.5 分布式事务3.事务控制语句4.显式事务的次数统计5.一致性非锁定读(快照查 ...

  8. 前端CDN公共库整理

    转自: 灰狼博客, 地址: http://itlobo.com/articles/2016.html 现在web应用都在使用js类库,这些类库小的几十K,大的几百K,而国内网络访问速度大家都知道不是那 ...

  9. .net core2.0通过entityframework访问Sqlserver数据库

    .net core经历2.0版本之后,已经非常稳定,完全可以进行企业级开发并跨平台部署到几乎任何服务器.个人测试效率是.net core是.net framework效率的3倍.其他语言没有测试,等测 ...

  10. Python入门指南（超详细）

    Python 是一门非常容易上手的语言,通过查阅资料和教程,也许一晚上就能写出一个简单的爬虫.但 Python 也是一门很难精通的语言,因为简洁的语法背后隐藏了许多黑科技.本文主要针对的读者是: 毫无 ...