Question

我想要制作几个“块”文本：

| 1 | | 2 | | 3 | | 4 | | 5 | | 6 |

在比平板电脑宽的屏幕上观看时，根据较小的屏幕尺寸进行响应，如下所示：

在平板电脑上：

| 1 | | 2 | | 3 |

| 4 | | 5 | | 6 |

在手机上：

| 1 |

| 2 |

| 3 |

| 4 |

| 5 |

| 6 |

当所有6个块都在一行时的全宽是980px。所以每个div是这个宽度的1/6（约163px）。我还希望每个div根据所查看的屏幕大小具有响应宽度并以屏幕为中心。

到目前为止，我正在使用float：left，但所有这一切都是在较小的屏幕上查看时将块保持在屏幕的左侧，在块的右侧留下一个很大的间隙，这不是我想要的。我希望这些街区居中。

我正在使用DIV来创建块，但不确定这是否是最好的方法？这是我使用atm的代码：

#block {
width: 163.33px;
float: left;
padding: 0px;        
}

如果有人对如何做到这一点有任何想法，那就太棒了： - ）

Answer 1

试试这个css

#block {
width: 163.33px;
display:inline-clock;
padding: 0px;        
}

#block父块

{
text-align-center;
}

Answer 2

如果我可以分享一个想法，你可以通过将文本块限制在一个元素中来实现。例如：

|A| = ||1| |2| |3| |4| |5| |6||

当您的html响应时，它会自动显示|A|，如您所说。如何使您的html响应可以阅读here。