html - 我怎样才能给我的全高元素？CSS

Question

我有这个网站:

http://avocat2.dac-proiect.ro/?page_id=21

我们用 firebug 对代码进行了一些更改并获得了这些元素(仍然没有在现场进行更改)

以下更改看起来像我的网站元素

这是 HTML 代码:

     <div class="container-fluid" style="">
          <div class="entry-content2">
               <div class="gigi">
                    <div class="row">
                    <div class="col-sm-12  col-md-12  col-lg-12  style=" "="">
                         <img src="wp-content/themes/WordPressBootstrap-master/images/LOGOb.png" class="img-responsive center-block" style="min-width:156px;min-height:83px">
                    </div>
               </div>
          </div>
          <div class="container-fluid">
               <p class="text-center" style="color:white;font-size:17px;padding-left:50px;padding-right:50px;padding-top:20px;padding-bottom:20px;">
                    Am reprezentat şi am acordat consultanţă juridică pentru clienţi persoane fizice române şi străine, instituţii publice, persoane juridice române şi străine în următoarele domenii:
               </p>
               <div class="row sss">
                    <div class="col-sm-4 col-md-4 col-lg-3 col-lg-offset-2" style="font-size:17px;color:white;">
                         <p class="text-left">
                              Drept civil<br>
                              – agricultură, exploatări agricole, prelucrarea şi comercializarea produselor agricole;<br>
                              – comerţ cu produse alimentare;<br>
                              – imobiliar;<br>
                              – distribuţie de carburanţi;<br>
                              – transporturi;<br>
                              – asigurări;<br>
                              – producţie şi comercializare utilaje grele;<br>
                              – producţie structuri metalice;<br>
                              – design, fotografie, artă;
                         </p>
                         <p></p>
                    </div>
                    <div class="col-sm-4 col-md-4 col-lg-3 col-lg-offset-0" style="font-size:17px;color:white;">
                         <p class="text-left">
                              Drept administrativ<br>
                              – producţie automatizări;<br>
                              – servicii de proiectare;<br>
                              – comercializare automatizări;<br>
                              – jocuri de noroc;<br>
                              – turism, hoteluri şi pensiuni;<br>
                              – medical;<br>
                              – construcţii civile şi industriale;<br>
                              – comercializare utilaje şi autovehicule, service auto;<br>
                              – producţie software, administrarea site-urilor;
                         </p>
                          <p></p>
                    </div>
                    <div class="col-sm-4 col-md-4 col-lg-3 col-lg-offset-0" style="font-size:17px;color:white;">
                         <p class="text-left">
                              – comerţ;<br>
                              – bursier, societăţi listate, investitori, fonduri de investiţii;<br>
                              – asistenţă şi îngrijire copii şi vârstnici;<br>
                              – exploatări forestiere şi prelucrarea lemnului;<br>
                              – extracţia şi prelucrarea minereurilor;<br>
                              – producţia şi comercializarea materialelor de construcţii;<br>
                              – instituţii publice;<br>
                              – instituţii religioase.
                         </p>
                         <p></p>
                    </div>
                    <p></p>
               </div>
          </div>
     </div><!-- .entry-content -->
</div>

我放一张图更好的理解我想做什么

我搜索了一下，在这里找到了一个可以给元素 100% 高度的方法

Make div 100% height of browser window

不幸的是，我们应用了下面的 100vh 代码，但看起来不太好。

.entry-content2
{
    background:url("http://avocat2.dac-proiect.ro/wp-content/themes/WordPressBootstrap-master/images/BODY-DROP.png");
    width:100%;
    height:100vh; // Here I applied this change      
}

我不知道我是否正确地应用了这个修正案。

你能帮我解决这个问题吗？ 提前致谢!

Answer 1

当我获取您的代码并将其放入我的 JSFiddle 中时，我就会运行它。我带了你 CSS，我唯一添加的是 color: #ffffff; 这样我就可以阅读文本了。

.entry-content2
{
    background-image:url("http://avocat2.dac-proiect.ro/wp-content/themes/WordPressBootstrap-master/images/BODY-DROP.png");
    color: #ffffff; // just added color
    width:100%;
    height:100vh; 
}

可以看到fiddle here的结果这也会在高度上创建一个全屏 div。

所以如果这个 fiddle 对你不起作用，那么我怀疑它一定是浏览器的问题？或者在 .entry-content2 div 之前带有标签的东西。您能否将完整的 css 和 html 代码放入 fiddle 中并进行测试。

您可以 play around with the fiddle