css - 有没有办法共享通用的 CSS 类?

标签 css

<分区>

我有 5 个 CSS 类。除了一条线外,它们完全相同。有没有办法创建一个 CSS 类,然后让其他 5 个 CSS 类继承自该类并添加它自己的特定类?

正如您在下面看到的,唯一不同的是这一行...

背景图片:url("../Images/vertTabsButton2.gif");

.divMasterCol1Button1 {
  float: left;
  border-style: none;
  border-width: thin;
  background-image: url("../Images/vertTabsButton1.gif");
  background-repeat: no-repeat;
  background-position-x: center;
  background-position-y: top;
  width: 215px;
  height: 700px;
  margin: 0px auto;
  padding: 0px;
  text-align: center;
}
.divMasterCol1Button2 {
  float: left;
  border-style: none;
  border-width: thin;
  background-image: url("../Images/vertTabsButton2.gif");
  background-repeat: no-repeat;
  background-position-x: center;
  background-position-y: top;
  width: 215px;
  height: 700px;
  margin: 0px auto;
  padding: 0px;
  text-align: center;
}

最佳答案

不使用 pre-compiler like SASS你无法实现继承。但是,您可以通过将通用属性拆分为一个类并通过其他一些 ID 或类应用剩余的唯一属性来完成您想要的事情。

.commonProperties {
  float: left;
  border-style: none;
  border-width: thin;
  background-repeat: no-repeat;
  background-position-x: center;
  background-position-y: top;
  width: 215px;
  height: 700px;
  margin: 0px auto;
  padding: 0px;
  text-align: center;
}

.divMasterCol1Button2 {
  background-image: url("../Images/vertTabsButton2.gif");
}

.divMasterCol1Button1 {
  background-image: url("../Images/vertTabsButton2.gif");
}

关于css - 有没有办法共享通用的 CSS 类?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32528320/

相关文章:

css - 如何将像素宽度值与 LESS Css 相乘?

html - 是否可以结合 Wordpress 模板 (Semplice) 和一些 HTML & CSS 页面?

javascript - 在一个函数中来回更改 id

html - Android 2.2 Web 浏览器中输入的绝对定位

html - 如何使用 CSS 制作 "button-like appearance"

html - CSS 表格列最小宽度等于文本大小

javascript - 如何在菜单下拉菜单中创建平滑过渡?

html - CSS 绝对不工作

html - 加载 gif 时主屏幕保持灰色

html - 负边距顶部在 Firefox 中不起作用