代码之家  ›  专栏  ›  技术社区  ›  adiian

如何在CSS中使用*标记?

  •  2
  • adiian  · 技术社区  · 16 年前

    我试图理解在CSS按钮中如何使用背景图像。图像似乎比按钮大得多,但角部仍然与按钮匹配(形成圆角按钮)。它似乎与 .btn * . 我找不到任何关于 * 可以使用。您能解释一下如何在按钮中使用 * 标签?

    我想 * 将匹配任何元素。但是我不知道在这种情况下,图像是如何呈现的。

    .btn {
    display: block;
    position: relative;
    background: #aaa;
    padding: 5px;
    float: left;
    color: #fff;
    text-decoration: none;
    cursor: pointer;
    }
    
    .btn * {
    font-style: normal;
    background-image: url(btn2.png);
    background-repeat: no-repeat;
    display: block;
    position: relative;
    }
    

    完整示例如下: http://monc.se/kitchen/59/scalable-css-buttons-using-png-and-background-colors/ .

    2 回复  |  直到 16 年前
        1
  •  1
  •   N 1.1    16 年前

    从btn.html,第17行。

    .btn span {
      background-position:left bottom;
      left:-5px;
      margin-bottom:-5px;
      padding:0 0 5px 10px;
    }
    

    上面的选择器负责圆角。( background-position 具体而言)
    尝试更改的值 背景位置 right bottom top left 你会看到变化。

    .btn * CSS定义将应用于类的所有子级 btn

        2
  •  0
  •   Ztyx    16 年前

    .btn * 指的是所有的标签,即儿童,孙子,孙子的孩子等,下面的标签有“btn”类。语法使用特殊类型的css选择器,称为 descendant selector .

    .btn 特别是指具有“btn”类的所有标记。