在html中沿着可点击网格的边界放置数字

Question

我有一个可点击的网格，其中单元格在点击时切换颜色。我需要在网格的边界放一些数字。包含它的最佳方法是什么？

最终结果应该是

        4     
        1 5 3
   1,2  [][][]  
 1,4,5  [][][]
   1,3  [][][]

这是我的JSfiddle没有周围的数字。

Answer 1

使用现有的表格单元格是否像https://jsfiddle.net/z9shwh0q/一样工作如果没有，你可以在它旁边创建另一个表格并将这些表格放在几个包装器中。

{{1}}

然后你会让我们用CSS来定位这些

Answer 2

我会定义额外的行/列，它们的样式会有所不同，并添加了不同的类（因此您可以避免将侦听器附加到这些类），就像@Aly Sebastien概述的那样。

然后在其中包含您的自定义数字。

如果你想创建更小的足迹，你可以附加：在带有内容的伪之前，并通过边缘上的css定位它们（​​参见Selecting and manipulating CSS pseudo-elements such as ::before and ::after using jQuery）