Css react/semantic ui：如何获得全屏片段

我想构建一个布局，如语义ui的主页示例：

第一个垂直的黑色线段几乎是全高。它是由

masthead

类完成的，但我不明白这个类是从哪里来的

我正在使用react，这是我目前的布局：

render() {
    return (
        <div>
            <Segment vertical inverted>
                <p>Main</p>
            </Segment>
            <Segment vertical>
                <p>First</p>
            </Segment>
        </div>
    )
}

render（）{
返回(
主要

首先

)
}

但是有了这个，第一个部分就没有完整的高度了。

用SUIR看看这个，它也是可以的<代码>报头类在SUI示例中定义，不属于框架的一部分，这些行为是通过自定义样式实现的：

<Segment
  inverted
  textAlign='center'
  style={{ minHeight: 700, padding: '1em 0em' }}
  vertical
>