That's my code at sunset

Layout
how about let a label around up and down the middle? This is not so difficult, the width of the label to the stator, and then the upper and lower margins it is 0, is about auto; follows:

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

It can be about the middle. Up and down, then, is to make the parent tag to show to a table, showing sub-tab to the cell and the vertical-align property to middle on it;

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

It can be up and down the ranks.
But ... this technology is too old! But only for the pc, mobile terminal is not suited to this ...
In fact, the mobile side is not difficult, with flex layout. This layout is not difficult, not particularly high-end technology, so it should learn it! Do not say directly on the code.

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

The above is achievable up and down the middle, but this has not only flex layouts so that it pretty cow!
The above core code:
the display: Flex; // tag to show Flex
The justify-Content: Center; // make the water sub-tab centrally
align-items: center; // tag vertical centering handicap

Guess you like

Origin www.cnblogs.com/10manongit/p/12222751.html