“`” \u53c2\u8003\u56de\u7b54\uff1a<\/p>\n
(1)margin:auto\u6cd5<\/p>\n
<pre><code>css:
\ndiv{
\nwidth: 400px;
\nheight: 400px;
\nposition: relative;
\nborder: 1px solid #465468;
\n}
\nimg{
\nposition: absolute;
\nmargin: auto;
\ntop: 0;
\nleft: 0;
\nright: 0;
\nbottom: 0;
\n}
\nhtml:
\n<div>
\n<img src=""mm.jpg"">
\n<\/div>
\n<\/code><\/pre><\/p>\n
\u5b9a\u4f4d\u4e3a\u4e0a\u4e0b\u5de6\u53f3\u4e3a0\uff0cmargin\uff1a0\u53ef\u4ee5\u5b9e\u73b0\u8131\u79bb\u6587\u6863\u6d41\u7684\u5c45\u4e2d.<\/p>\n
(2)margin\u8d1f\u503c\u6cd5<\/p>\n
<pre><code>.container{
\nwidth: 500px;
\nheight: 400px;
\nborder: 2px solid #379;
\nposition: relative;
\n}
\n.inner{
\nwidth: 480px;
\nheight: 380px;
\nbackground-color: #746;
\nposition: absolute;
\ntop: 50%;
\nleft: 50%;
\nmargin-top: -190px; \/height\u7684\u4e00\u534a\/
\nmargin-left: -240px; \/width\u7684\u4e00\u534a\/
\n}<\/p>\n
<\/code><\/pre><\/p>\n
\u00a0<\/p>\n
\u8865\u5145\uff1a\u5176\u5b9e\u8fd9\u91cc\u4e5f\u53ef\u4ee5\u5c06marin-top\u548cmargin-left\u8d1f\u503c\u66ff\u6362\u6210\uff0c
\ntransform\uff1atranslateX(-50%)\u548ctransform\uff1atranslateY(-50%)<\/p>\n
(3)table-cell\uff08\u672a\u8131\u79bb\u6587\u6863\u6d41\u7684\uff09<\/p>\n
\u8bbe\u7f6e\u7236\u5143\u7d20\u7684display:table-cell,\u5e76\u4e14vertical-align:middle\uff0c\u8fd9\u6837\u5b50\u5143\u7d20\u53ef\u4ee5\u5b9e\u73b0\u5782\u76f4\u5c45\u4e2d\u3002<\/p>\n
<pre><code>css:
\ndiv{
\nwidth: 300px;
\nheight: 300px;
\nborder: 3px solid #555;
\ndisplay: table-cell;
\nvertical-align: middle;
\ntext-align: center;
\n}
\nimg{
\nvertical-align: middle;
\n}
\n<\/code><\/pre><\/p>\n
(4)\u5229\u7528flex<\/p>\n
\u5c06\u7236\u5143\u7d20\u8bbe\u7f6e\u4e3adisplay:flex\uff0c\u5e76\u4e14\u8bbe\u7f6ealign-items:center;justify-content:center;<\/p>\n
\u00a0<\/p>\n
\u00a0<\/p>\n
<pre><code> "“`
\n<\/code><\/pre>\n","protected":false},"excerpt":{"rendered":"
“`” \u53c2\u8003\u56de\u7b54\uff1a (1)margin:auto\u6cd5 <pre><co […]<\/p>\n","protected":false},"author":7,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[101],"tags":[],"class_list":["post-43037","post","type-post","status-publish","format-standard","hentry","category-c"],"_links":{"self":[{"href":"http:\/\/wx.kaifamiao.info\/index.php\/wp-json\/wp\/v2\/posts\/43037","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/wx.kaifamiao.info\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/wx.kaifamiao.info\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/wx.kaifamiao.info\/index.php\/wp-json\/wp\/v2\/users\/7"}],"replies":[{"embeddable":true,"href":"http:\/\/wx.kaifamiao.info\/index.php\/wp-json\/wp\/v2\/comments?post=43037"}],"version-history":[{"count":1,"href":"http:\/\/wx.kaifamiao.info\/index.php\/wp-json\/wp\/v2\/posts\/43037\/revisions"}],"predecessor-version":[{"id":43038,"href":"http:\/\/wx.kaifamiao.info\/index.php\/wp-json\/wp\/v2\/posts\/43037\/revisions\/43038"}],"wp:attachment":[{"href":"http:\/\/wx.kaifamiao.info\/index.php\/wp-json\/wp\/v2\/media?parent=43037"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/wx.kaifamiao.info\/index.php\/wp-json\/wp\/v2\/categories?post=43037"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/wx.kaifamiao.info\/index.php\/wp-json\/wp\/v2\/tags?post=43037"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}