小编J.D*_*Doe的帖子

到目前为止，我一直在尝试创建这张图片中显示的基本网站布局。 https://imgur.com/a/JhURder

它包括一个灰色背景，里面有一个带有白色背景的居中 div。将图像居中左侧，文本等居中右侧。

我是 twitter bootstrap 的大力倡导者，到目前为止我已经实现了这一点。（反应风格）

            <div class="container-fluid" style={{
                'background-color' : 'rgb(224,225,226)',
                'height' : '40vh'
            }}>
                <div class="row">
                    <div class="col-1 text-center"> Test </div>

                    <div class="col-10 text-center" style={{
                        'height' : '30vh',
                        'background-color' : 'rgb(255,255,255)',
                        'margin-top' : '5vh'
                    }}>

                    centered

                    </div>

                    <div class="col-1 text-center">test</div>
                </div>
            </div>

到目前为止，它已经进行了一半。但老实说，我有点给了我们，因为它变成了一个嵌套的烂摊子。随着网站开发，我一直知道他们是一个更大的方式，所以我来这里是为了让人们对我的尝试进行迄今为止的尝试，并可以以适当的方式给我实现我的目标。