如何将 post 标题放在 table 两列中

Question

我想将 post 标题放在 2 列的 table 中。

例如：

-------------------------------
post tile 1   |  post title 2
-------------------------------
post title 3  |  post title 4
-------------------------------
post title 5  |  post title 6

我可以打印 post 标题，但如何将所有内容放入 table 和列中。

这是我到目前为止编写的代码。 PS：本人对博主主题开发了解不多

代码：

<b:section class='main' id='main' name='Main' showaddelement='yes'>
<b:widget id='Blog1' locked='false' title='Blog Posts' type='Blog'>

    <b:includable id='main' var='top'>
       <b:include name='allposts'/>
    </b:includable>

    <b:includable id='allposts'>
        <b:loop var='thisPost' values='data:posts'>
            <h2>
                <a expr:href='data:thisPost.url'>   <data:thisPost.title/></a>
            </h2>
        </b:loop>
    </b:includable>

</b:widget>

Answer 1

您需要做的就是围绕标题创建一个容器元素并使用 CSS display flex 布局 table

<b:section class='main' id='main' name='Main' showaddelement='yes'>
<b:widget id='Blog1' locked='false' title='Blog Posts' type='Blog'>

    <b:includable id='main' var='top'>
        <b:include name='allposts'/>
    </b:includable>

    <b:includable id='allposts'>
        <div class="container">
            <b:loop var='thisPost' values='data:posts'>
                <h2>
                    <a expr:href='data:thisPost.url'><data:thisPost.title/></a>
                </h2>
            </b:loop>
        </div>
    </b:includable>

</b:widget>

CSS

.container {
   display: flex;
   flex-wrap: wrap;
}
h2 {
   flex: 1 0 45%;
}

结果

.container {
  display: flex;
  flex-wrap: wrap;
 }
 h2 {
  flex: 1 0 45%;
 }

<div class="container">
 
     <h2><a href='#'>foo</a></h2>
     <h2><a href='#'>foo</a></h2>
     <h2><a href='#'>foo</a></h2>
     <h2><a href='#'>foo</a></h2>
     <h2><a href='#'>foo</a></h2>
     <h2><a href='#'>foo</a></h2>
     <h2><a href='#'>foo</a></h2>
     <h2><a href='#'>foo</a></h2>
 
</div>

如何将 post 标题放在 table 两列中

How to put post title in a table of two columns

css

xml

blogger

例如：

代码：