zoukankan      html  css  js  c++  java
  • 那是我在夕阳下的code

    布局
    何如让一个标签上下左右都居中?这有什么难的,给定子标签的宽,再让它的边距上下为0,左右为auto;如下:

    .child{10px;margin:0 auto;}//子标签

    它就可以左右居中了。上下的话,就是让父标签展现成表格,子标签展现成单元格并把vertical-align属性设置成middle就可以了;

    .father{display:table}
    .child{display:table-cell;vertical-align: middle;}

    它就可以了上下也居了。
    但是...这种技术太老了!而且只适合pc端,移动端的不适合用这套...
    其实移动端的不难,用flex布局。这布局也不难,不是特别高端的技术,所以应该把它学起来!不说了直接上代码。

    .father{background-color: red; 120px;height: 110px;display: flex;justify-content:center;align-items:center;}
    .child{background-color: blue; 20px;height: 10px;}

    上面也是可以实现上下左右居中,而且flex布局不仅仅这有这样,它相当牛!
    上面的核心代码:
    display: flex;//标签展现成flex
    justify-content:center;//让子标签水居中
    align-items:center;//让子标签垂直居中

  • 相关阅读:
    java关键字synchronized
    JVM调优之jstack找出最耗cpu的线程并定位代码
    高性能Mysql
    awk使用入门
    JVM性能调优监控工具
    java垃圾回收算法
    JVM内存模型
    jvm之内存分配与回收策略
    leetcode 78. 子集(c++)
    leetcode 148. 排序链表(c++)
  • 原文地址:https://www.cnblogs.com/10manongit/p/12222751.html
Copyright © 2011-2022 走看看