首页 > 解决方案 > 在移动视图中隐藏 div 在 HTML 中不起作用

问题描述

我有一个 HTML 网站,我试图在其中隐藏一个包含移动视图中图像的 div。

@media screen and (max-width: 600px) {
  #kingg { display: none !important; }

}
<div id="kingg" class="grid-uniform section-four"  >
  <div class="container">

    <div class="main-title">
      <div class="hometab-heading box-heading">ABOUT US</div>
      <div class="title-sep"></div>
    </div>

    <div class="grid__item ">
      <div class="grid__item wide--two-thirds post-large--two-thirds large--two-thirds">

        <p>Anvi Jewellers founded by <b>Lavanya Ghulekar</b> in 2017 is a by-product of the passion for creativity of a home maker. Our vision is to build trust with high ethical standards, fair pricing and added value to our customers. We have made it our mission to strive every day to earn the confidence and trust of our clients by meeting and exceeding expectations of quality, service, and unsurpassed value. We expertise in all types of designer light-weight kundan, antique, c-zet, pearl jewellery etc. We make gold ornaments in 20 carat and 22 carat. Anvi Jewellers was founded with a refreshing and courageous objective to make beautiful jewellery accessible, affordable and forever. After 2 years of happy clients, Anvi Jewellers has finally launched online.  Anvi provides our clients with more than they imagined and less than they anticipated.</p>
        <div class="invisible-medium"></div>

        <div style="margin-top:52px;" class="grid__item ">

          <div  class="grid__item wide--one-third post-large--one-third large--one-third medium--one-half small--grid__item">

            <img id="see" src="images\a1.jpg" height="259.95" width="239.95" alt="" title="" />

          </div>


          <div  class="grid__item wide--one-third post-large--one-third large--one-third medium--one-half small--grid__item">

            <img id="seep" src="images\a11.jpg" height="259.95" width="239.95" alt="" title="" />

          </div>

          <div  class="grid__item wide--one-third post-large--one-third large--one-third medium--one-half small--grid__item">

            <img id="seel" src="images\a3.jpg" height="259.95" width="239.95" alt="" title="" />

          </div>
        </div>
      </div>

现在的问题是,它在 localhost 中工作,但是当我将它上传到服务器时,它并没有隐藏 div。这是我的网站链接网站

谁能告诉我可能是什么问题?

标签: javascripthtmlcss

解决方案


使用正确的 id 或类。使用下面的代码隐藏文本。

.grid__item p:nth-child(1) {
    display: none;
}

推荐阅读