0

是否可以使用相同的 css 制作两个 div，例如：

.Navig1, .Navig11 a {
  display: block;
  height: 15px;
  width: 70px;
  background-color: {color: Navig Bg 1};
  text-align: center;
  font-size: 8px;
  line-height: 15px;
  color: #FFF;
}

因为我不希望我的样式代码太长，并且我需要这两个看起来相同，但悬停时不同，我认为这样做可以，但是这段代码不起作用。我在哪里犯错？

4

4 回答 4

4

是的，有可能：

.Navig1 a, .Navig11 a {
  display:block;
  height:15px;
  width:70px;
  background-color:#000;
  text-align:center;
  font-size:8px;
  line-height:15px;
  color:#FFF;
}

.Navig1 a:hover {
  /*css property*/
}

.Navig11 a:hover {
  /*other css property*/
}
于 2012-11-24T14:55:37.940 回答
0

css 不是“可编程的”。没有变量或方法可以说“使用此处第 X 节中包含的样式”。

但是，您可以通过从此块中删除 bgcolor 定义并创建一个新的来修复它

.Navig1, .Navig11 a {
    ... as before ...
}

.Navig1, .Navig11 {
    background-color: #xxx;
}
于 2012-11-24T14:54:15.163 回答
0

你可以做你想做的事：

.Navig1, .Navig11 a {
    /* Common Styles */
}

.Navig1:hover {
    /* Navig1 Specific Styles on Hover */
}

.Navig11 a:hover {
    /* Navig1 a Specific Styles on Hover */
}

但是，正如其他回答者提到的那样，您破坏了 CSS。背景颜色应该怎么回事？

于 2012-11-24T14:55:26.850 回答
0

如果您还提供 html，则更容易确定您要实现的目标。不需要有两个 CSS 类。您可以使用单个 CSS 类为页面上的多个元素设置样式。

如果你有多个 div 容器，其中两个容器带有一个名为 mynav 的类：

<div class="mynav"></div>
<div></div>
<div class="mynav"></div>

然后一个 CSS 类将同时影响两者。

div.mynav a {
    display: block;
    height: 15px;
    width: 70px;
    text-align: center;
    font-size: 8px;
    line-height: 15px;
    color: #fff;
}

div.mynav a:hover {
    /* new css */
}

如果您希望有一个变化，那么您只需要根据您正在执行的操作创建元素如何更改的规则。

如果需要，还可以考虑为单个元素使用多个类。你的 div 可能是：

<div class="mynav someotherclass"></div>

您可能会发现，对于您正在做的事情，一些简单的 Javascript 是最好的解决方案。

于 2012-11-24T15:05:51.997 回答