问题标签 [pure-css]

我模仿了一个具有 3d 效果的纯 css 滑块，其中单击不会推进滑块。当我改变它时，点击确实会推进滑块。有什么帮助，所以点击不会推进滑块吗？

原始 Codepen https://codepen.io/panfilov/pen/GogJVy

例如，他们的 CSS

我的 Codepen https://codepen.io/michael-lythcott/pen/RmOWbe

矿：

我所做的只是改变了 3d 效果的大小和设置，以使 3d 效果看起来像一叠卡片。

我希望我的笔保持不变，除了单击幻灯片上的任何位置不会推进滑块。

我正在尝试构建一个可以覆盖一些文本的内容框。我正在努力构建一个新功能。虽然它正在开发中，但我想实际展示一些将在页面上发生的变化。因此我想把它全部放在一个灰色的盒子里，然后把“建设中”的文字从一个角落覆盖到另一个角落。

我正在将 PureCSS 用于其他元素，我知道这不应该是一个需要的细节，但是如果这个框架已经内置了一些我不知道的很酷的东西，那么使用它会很棒。

所以我想在这个部分周围放一个框，所以我选择把它放在一个看起来最好的网格上下文中。我还想在框上以 45 度角放置一些文字。这是我开始的地方，现在我想稍微改进一下。我想不是以 45 度角覆盖内容，而是从一个角落到另一个角落。现在最重要的是，我希望它随着内容框和页面的大小变化而动态调整大小。除了一些将线条放在框上的示例之外，我没有发现任何其他内容，但没有任何东西是动态的，也没有任何内容包含文本。

我需要一种方法来进行数学动态计算以计算出盒子的大小，然后计算出正确的角度，或者让它从左下角到右上角的相对定位。因此我知道transform: rotate(-45deg);遗嘱需要改变。如果可能的话，我想将文本居中放在这一行上。

最后，如果可能的话，这有点离题，让“正在建设中”全部来自 CSS 样式会很棒，但我还没有弄清楚如何让它工作。当我试图把它放在content: '';CSS 的一部分然后把它从 HTML 中取出时，所有的文本都消失了，只剩下表情符号。

如果这是重复的，请帮助指导我正确的方式，我花了一些时间寻找，也许我的搜索词很糟糕，但我还没有找到好的解决方案。

更新一些 Javascript 来定义角度 我创建了一个小附加函数来定义从角到角的角度div。现在我需要一些帮助来添加我的 CSS。我确实必须在上面添加以下内容，div以便我可以获得属性id="diag"

我需要将我创建的新变量添加rotatdeg到工作表的样式中。请帮忙。

我也发现这并没有帮助，也许一些解释会帮助本教程更有意义：http: //jonraasch.com/blog/javascript-style-node

我想要一个 7 列网格。我可以通过 Purecss“pure-u-1-7”实现这一点。但是当与 sm,md,lg,xl 结合使用时，它不起作用。它成为一列。我想要一个 7 列，当它在小型设备上查看时，它应该变成单列。像这样“pure-u-1-7 Pure-u-sm-1-1”

我想使用此处提供的代码创建一个 404 错误网页：

https://codepen.io/SofiaSergio/pen/RMjyRL

正如作者所提到的，这是纯 CSS。但是我不确定纯 CSS 的使用是否与标准 CSS 相同。我创建了一个 HTML 和 CSS 文件mystyle.css，将它们放在一个文件夹中

但是，它只显示一个带有橙色背景的大数字。我尝试在样式标签中制作 CSS，但结果相同：

我实际上要做的是将代码添加到 wordpress 页面。我通常创建一个 HTML 代码块，并将 css 粘贴到我的主题的自定义 CSS 部分。但是，上面的代码在 wordpress 中也不起作用。如果有人告诉我如何使代码可行，我将不胜感激。谢谢

我尝试使用文档中解释的纯 css 网格系统，但我无法使其在桌面分辨率和 Pixel 2 分辨率等移动设备上工作。

而不是像这样进行 2 行：

我遇到了这个字母间距问题，并且 div 在同一行：

喜欢代码示例

我正在构建一个基于框架的小型博客metalsmith，PureCSS它有一个简单的三行布局，如下所示：

由于我还在学习很多关于 CSS 和响应式设计的新东西，我想知道导航栏是否也应该放入网格行中，或者是否应该驻留在网格行之外。PureCSS 文档声明如下：

人们可见的所有内容都需要包含在网格单元内。这确保了内容将被正确呈现。

这将使它成为yes，因为导航菜单对用户当然是可见的。但是，这不会使导航栏的媒体查询处理更加复杂吗？那么在使用响应式网格时，我应该将导航栏放在哪里？

我有以下基本布局，现在我想使用纯 CSS 将其转换为响应式网格。

不幸的是，我不知道如何隐藏例如<div class="pure-u-3-24">ToC</div>在特定断点上。

我查看了基础文件pure.css以及包含网格grids-responsive.css的类的 css 。.hidden-*-downBootstrap 中似乎没有类这样的东西。我也找不到任何（purecss-）实用程序来完成此操作。

如何使用 PureCSS 实现我的目标并在特定断点上隐藏元素？

以下代码使用 jQuery。是否可以使用循环创建仅 CSS 版本。我已经看到了显示 DIV 的示例，但每个 DIV 都是单独编码的，带有时间延迟。如果我添加额外的 DIV，此类代码将需要更新 CSS。相反，如果可能的话，我想在 CSS 中使用某种循环。

我有一个引导站点，我在其中使用 purecss 作为下拉菜单，并将其包装在引导导航栏中以使其成为粘性导航栏。悬停下拉菜单时，会出现错位。如何纠正它？

我正在使用纯 css库设置一个项目，并且我想使用他们的响应式侧面菜单示例（这个问题在这个网站上直接可见）。

我刚刚发现问题发生在 Chrome 浏览器中，但不在 Firefox 中。

当视口宽度低于 768px 时，菜单默认隐藏，这要归功于 css 媒体查询。

使用按钮打开菜单#menu-link按预期工作，但关闭它会延迟大约 300 毫秒，代码中没有任何明显的原因。如果console.log在点击处理函数中添加了任何内容，它会在这个神秘的 300 毫秒延迟后显示。就像 Chrome 在此时间之前不执行处理程序一样。

删除元素上的 css 过渡并不能解决问题。

你知道它来自哪里，和/或如何在点击触发后立即关闭菜单？这是 Chrome 中的一些已知问题吗？