问题标签 [unsemantic-css]

我对前端开发和无语义都是新手。我试图让两种不同的字体大小坐在同一行。但传统方法似乎不起作用。我试过垂直对齐：“底部；” 但这并没有削减它。 这就是它目前的样子 我很抱歉我不能用 jsfiddle 给你看，使用非语义意味着它没有正确显示

这是CSS

我使用“无语义”的框架。当我创建一个 4 列的网格时，如果网格的所有元素的高度不同，则当我缩小窗口时网格会中断（从第三个块开始）。

见这里http://cemf.fr/lpem/paul-meyer/

有人知道怎么修这个东西吗？

网页：

我正在使用 Unsemantic CSS Grid 框架来创建一个看起来像这样的布局（简化以使问题清晰）：

您在这里看到的是 3 行，每行有 2 列。代码大致如下：

使用 3 行的好处是，即使图像 1 和图像 2 的高度不同，它们下面的文本段落也会在两列中排列（意味着它在两列中从相同的垂直位置开始），因为我使用图像后的“清晰”。如果我改为使用 1 行和 2 列，其中每一列是一个 div，其中一个标题、图像和段落文本一个在另一个之上，那么如果图像具有不同的高度，则段落文本将不会对齐。所以使用 3 行给了我我正在寻找的东西。

不幸的是，在移动设备上查看时会发生这种情况：

这是因为每行的两列最终彼此重叠。

我想得到的是：

换句话说，我希望 row1col1、row2col1 和 row3col1 粘在一起，然后 row1col2、row2col2 和 row2col2 出现在下面。

我该怎么做呢？Unsemantic 中是否有任何东西可以让我将一列“捆绑”在一起。

如果我改为创建 2 个带有标题、图像和文本段落的 div，并将它们放在 1 行中，这将解决这个问题，但是如果图像的高度不同，文本段落将不会对齐。我无法对高度进行硬编码，因为这是一种流体布局，当页面宽度发生变化时，列的宽度会发生变化，这反过来又会改变图像的宽度（因为它们的宽度设置为容器的 100% )，因此它们的高度会发生变化。使这种方法发挥作用的任何技巧、变通方法或建议都将是最有帮助的。

作为最后的手段，我正在考虑使用 jQuery 在页面调整大小时定位段落文本；如果您认为这是一个很好的解决方案（或唯一的解决方案），请随时分享在此方法中需要注意的任何建议或陷阱。

我只是想在我的 CSS/SASS 注释中添加一些视觉上的区别，这样当我冲过一堆我正在处理的文件时，我可以更快地注意到它们。所以我想，为什么不使用dingbats，你的代码中看不到类似的东西，那为什么不开始使用它呢？

例如这里的交叉装饰：

我的问题 -在 CSS/SASS 或 JS中使用dingbats或以这种方式使用任何代码注释在语义上是否错误？

SASS 似乎并不介意这一点。页面加载也很整齐。

但不适合强迫症患者。

我正在使用unsemantic.css，有一个基本的布局：

我希望选择框的宽度等于它的父 div（网格行的 35%）。此元素的默认宽度由其选项的长度确定。

试过：

但这一切都没有影响。当我将宽度设置为某个特定值（500 像素）时，它运行良好但没有响应。