html - 在 CSS 中设置元素的高度和宽度的简写

Question

基本问题，但我无法在任何地方找到它，是否可以在我的 CSS 中使用相同的值同时在同一行上设置宽度和高度？

我不是要这样的东西:

width:100%;height:100%;

但更像是其中之一:

width, height: 100%; // Same for both
width, height: 100%, 90%; // Different for each ones
dimensions: 100% 90%; // Like padding/margin, 

我只是问声明，而不是 Javascript 如何做到这一点。 I found a related question对于这个，但对于边界，简短的回答是否定的。

如果用 CSS 不行，那用 SCSS 行吗？

Answer 1

没有用于在单个属性声明中设置元素的height 和width 的简写方式。你也不能用 SASS 来做。

但是，是的，SASS 将为您提供一项功能，通过声明一个 variable 来保存两个属性中共享的公共(public)值

$some-var-name: 100px;

.some-class {
  height: $some-var-name;
  width: $some-var-name;
}

正如我所说，即使是 SASS 也无法帮助您同时编写 height 和 width，但您可以使用从单个变量更改两者的值。

---

好的，我正要在答案中添加 @extend，但由于其他用户已经回答了相同的问题，(现已删除)

.size{
    height:100%;
    width:100%;
}

element {
    @extend .size;  //Sets element to height:100%;width:100%;
    // more stuff here
}

我建议你使用 % 的声明而不是 . 所以不要使用 .size 建议使用 %size 。这样，仅用于扩展目的的 .size 文字类将不会包含在已编译的样式表中。