{"id":110119,"date":"2020-05-02T03:26:17","date_gmt":"2020-05-01T19:26:17","guid":{"rendered":"http:\/\/4563.org\/?p=110119"},"modified":"2020-06-02T22:15:37","modified_gmt":"2020-06-02T14:15:37","slug":"%e6%9c%89%e6%b2%a1%e6%9c%89%e5%8a%9e%e6%b3%95%e4%bd%bf-dispalyflex-%e7%9a%84%e5%85%83%e7%b4%a0%e7%9a%84%e5%ad%90%e5%85%83%e7%b4%a0%e5%ae%9e%e7%8e%b0%e8%be%b9%e8%b7%9d%e9%87%8d%e5%8f%a0","status":"publish","type":"post","link":"http:\/\/4563.org\/?p=110119","title":{"rendered":"\u6709\u6ca1\u6709\u529e\u6cd5\u4f7f dispaly=flex \u7684\u5143\u7d20\u7684\u5b50\u5143\u7d20\u5b9e\u73b0\u8fb9\u8ddd\u91cd\u53e0"},"content":{"rendered":"
\n
\n
\n

\u6709\u6ca1\u6709\u529e\u6cd5\u4f7f dispaly=flex \u7684\u5143\u7d20\u7684\u5b50\u5143\u7d20\u5b9e\u73b0\u8fb9\u8ddd\u91cd\u53e0 <\/h1>\n

<\/p>\n

\n
\u8cc7\u6df1\u5927\u4f6c : TomVista <\/span> <\/i> 53<\/span> <\/div>\n
<\/div>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n
\u6211\u641c\u7684\u535a\u5ba2\u90fd\u8bf4 flex \u5e03\u5c40\u7684\u5143\u7d20\u662f bfc,,,,,\u7ed3\u679c mdn \u4e0a\u662f
Flex items (direct children of the element with display: flex or inline-flex).
https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/Guide\/CSS\/Block_formatting_context<\/p>\n

\u4f4e\u8d28\u91cf\u535a\u5ba2\u5bb3\u4eba <\/p><\/div>\n

\u5927\u4f6c\u6709\u8a71\u8aaa<\/b> (8<\/span>) <\/div>\n
<\/div>\n<\/p><\/div>\n<\/p><\/div>\n
    \n
  • \n
    \n
    \n
    \u4e3b<\/span> \u8cc7\u6df1\u5927\u4f6c : TomVista <\/span> <\/div>\n
    <\/i> <\/span> <\/div>\n<\/p><\/div>\n
    \u5e26\u6709 display:flex \u7684\u5143\u7d20\u4f1a\u521b\u5efa BFC, \u8fd9\u6837\u7406\u89e3\u54ea\u91cc\u6709\u9519\u5417? <\/div>\n<\/p><\/div>\n<\/li>\n
  • \n
    \n
    \n
    \u8cc7\u6df1\u5927\u4f6c : rabbbit <\/span> <\/div>\n
    <\/i> <\/span> <\/div>\n<\/p><\/div>\n
    @rabbbit \u5e26\u6709 display:flex \u7684\u5143\u7d20\u7684\u7b2c\u4e00\u7ea7\u5b50\u5143\u7d20\u662f bfc. \u5e26\u6709 display:flex \u7684\u5143\u7d20\u4e0d\u662f. <\/div>\n<\/p><\/div>\n<\/li>\n
  • \n
    \n
    \n
    \u4e3b<\/span> \u8cc7\u6df1\u5927\u4f6c : TomVista <\/span> <\/div>\n
    <\/i> <\/span> <\/div>\n<\/p><\/div>\n
    @TomVista
    \u5e26 display: flex \u7684\u4e0d\u662f\u5417?
    \"\u6709\u6ca1\u6709\u529e\u6cd5\u4f7f <\/div>\n<\/p><\/div>\n<\/li>\n
  • \n
    \n
    \n
    \u8cc7\u6df1\u5927\u4f6c : rabbbit <\/span> <\/div>\n
    <\/i> <\/span> <\/div>\n<\/p><\/div>\n
    \"\u6709\u6ca1\u6709\u529e\u6cd5\u4f7f <\/div>\n<\/p><\/div>\n<\/li>\n
  • \n
    \n
    \n
    \u8cc7\u6df1\u5927\u4f6c : rabbbit <\/span> <\/div>\n
    <\/i> <\/span> <\/div>\n<\/p><\/div>\n
    \u6211\u8fd9\u91cc\u4e0d\u662f https:\/\/i.loli.net\/2019\/12\/25\/PtqDeubflJcsX6g.png <\/div>\n<\/p><\/div>\n<\/li>\n
  • \n
    \n
    \n
    \u4e3b<\/span> \u8cc7\u6df1\u5927\u4f6c : TomVista <\/span> <\/div>\n
    <\/i> <\/span> <\/div>\n<\/p><\/div>\n
    \u53d1\u9519\u4e86 ![ls7mqI.png]( https:\/\/s2.ax1x.com\/2020\/01\/06\/ls7mqI.png) <\/div>\n<\/p><\/div>\n<\/li>\n
  • \n
    \n
    \n
    \u4e3b<\/span> \u8cc7\u6df1\u5927\u4f6c : TomVista <\/span> <\/div>\n
    <\/i> <\/span> <\/div>\n<\/p><\/div>\n
    ![ls7UZq.png]( https:\/\/s2.ax1x.com\/2020\/01\/06\/ls7UZq.png) <\/div>\n<\/p><\/div>\n<\/li>\n
  • \n
    \n
    \n
    \u4e3b<\/span> \u8cc7\u6df1\u5927\u4f6c : TomVista <\/span> <\/div>\n
    <\/i> <\/span> <\/div>\n<\/p><\/div>\n
    \u6d4b\u8bd5\u4ee3\u7801<\/p>\n

    <body>
    <div style=”display:flex;”>
    <div class=”box”><\/div>
    <div class=”box”><\/div>
    <div class=”box”><\/div>
    <div class=”box”><\/div>
    <\/div>
    <div class=”flex box”><\/div>
    <div class=”flex box”><\/div>
    <div class=”flex box”><\/div>
    <div class=”flex box”><\/div><\/p>\n

    <style>
    .box{
    border: 1px red solid;
    height: 20px;
    width: 20px;
    margin: 10px;
    }
    .flex{
    display: flex;
    }
    <\/style>
    <\/body> <\/div>\n<\/p><\/div>\n<\/li>\n

  • \n","protected":false},"excerpt":{"rendered":"

    \u6709\u6ca1\u6709\u529e\u6cd5\u4f7f dispaly=fl…<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[],"tags":[],"_links":{"self":[{"href":"http:\/\/4563.org\/index.php?rest_route=\/wp\/v2\/posts\/110119"}],"collection":[{"href":"http:\/\/4563.org\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/4563.org\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/4563.org\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/4563.org\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=110119"}],"version-history":[{"count":1,"href":"http:\/\/4563.org\/index.php?rest_route=\/wp\/v2\/posts\/110119\/revisions"}],"predecessor-version":[{"id":110122,"href":"http:\/\/4563.org\/index.php?rest_route=\/wp\/v2\/posts\/110119\/revisions\/110122"}],"wp:attachment":[{"href":"http:\/\/4563.org\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=110119"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/4563.org\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=110119"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/4563.org\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=110119"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}