首页 > 解决方案 > 不应用 CSS 类?

问题描述

似乎我在文档头部定义的 CSS 类没有被识别或应用。知道我错过了什么或做错了吗?

JS小提琴

<html>
  <head>
      <title>EXAMPLE</title>
      <style>
          .show_x
          {
              visibility: visible;
          }
          //
          .hide_x
          {
              visibility: hidden;
          }
      </style>
      <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
      <script
  src="https://code.jquery.com/jquery-3.3.1.min.js"
  integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
  crossorigin="anonymous"></script>
      <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
  </head>
  <body>
        <span class="hide_x glyphicon glyphicon-warning-sign text-danger"></span>
        <span class="glyphicon glyphicon-warning-sign text-danger" style="visibility: hidden;"></span>
    </body>
</html>

我希望看不到任何警告标志,但我看到了第一个。第二个被正确隐藏。

标签: htmlcsstwitter-bootstrap

解决方案


内联注释在 CSS 中不起作用,所以你有

      .show_x
      {
          visibility: visible;
      }
      // <-- invalid CSS
      .hide_x
      {
          visibility: hidden;
      }

这可能会使浏览器停止处理该 CSS 块,方便地在两者中更明显(或更不明显)之前......无论如何,当它隐藏东西时更容易看到它......你明白我的意思.

在 CSS 中我们只能使用块注释/**/,这是一个简单的错误。


推荐阅读