Question

我的登陆屏幕上有一个幻灯片，我希望它是全屏与70px高度的导航栏相结合，我试图使用sass，这样我就不必为此编写javascript代码了，但是

.slideshow{height:100vh-70px}

不起作用。我不知道sass是如何计算的，CSS原来是

.slideshow{height:99.27083vh}

我快速搜索了这个问题，但找不到任何有用的信息。那可行吗？

如果不是，无论如何都没有javascript吗？

Answer 1

尝试使用CSS calc。这很漂亮widely supported。

.slideshow {
    height: calc( 100vh - 70px );
}

Answer 2

不，不是。

当SASS编译为CSS时执行SASS计算。

在将页面加载到浏览器之前，不知道视口的高度。因此，您无法获取该高度，将其转换为像素，并使用它进行计算。

Answer 3

我们使用的css高度如下所示： height：auto | length |％| initial | inherit;

但是，每个都应该用px等数字表示。每个值的描述如下：

auto :(默认）浏览器计算高度。

length：以px，cm等为单位定义高度

％：定义包含块的高度百分比。

initial：指定应将属性的值设置为默认值。 inherit：指定属性的值应该从父元素继承。

设置段落的高度和宽度的示例如下：

P {身高：100px; 宽度：100像素;}