javascript - html中的图像无法在页面中正确显示

Question

我有一个 html 图像，它应该适合屏幕。我的 html 代码如下:

  <div  class="page">

        <!-- preloader start -->
        <div id="preloader">
          <div id="status">&nbsp;</div>
        </div>
        <!-- preloader end -->

        <!--header start-->
        <header id="masthead"   class="header ttm-header-style-classic-overlay">
            <!-- ttm-header-wrap -->
            <div class="ttm-header-wrap">
                <!-- ttm-stickable-header-w -->
                <div id="ttm-stickable-header-w" class="ttm-stickable-header-w clearfix">
                    <div id="site-header-menu" class="site-header-menu">
                        <div class="site-header-menu-inner ttm-stickable-header">
                            <div class="container">
                                <!-- site-branding -->
                                <div class="site-branding">
                                    <a class="home-link" href="index.html" title="Planwey" rel="home">
                                        <img id="logo-img" class="img-center" width="260" src="https://homepages.cae.wisc.edu/~ece533/images/airplane.png" alt="logo-img">
                                    </a>
                                </div><!-- site-branding end -->
                                <!-- header-icins -->

                                <!--site-navigation -->
                                <div id="site-navigation" class="site-navigation">
                                    <div class="ttm-menu-toggle">

                                    </div>
                                    <nav id="menu" class="menu">
                                        <ul class="dropdown">
                                            <li  class="active"><a style="font-size:25px;" href="index.html">Telangana Event Industry Association</a>

                                            </li>
                                            &nbsp
                                            &nbsp
                                            &nbsp
                                            &nbsp
&nbsp
&nbsp
&nbsp
&nbsp
&nbsp
&nbsp
&nbsp
&nbsp
&nbsp
&nbsp
&nbsp
&nbsp
&nbsp
&nbsp
                                            &nbsp
                                            &nbsp
                                            &nbsp
                                            &nbsp
<li>
                                        </ul>
                                    </nav>
                                </div><!-- site-navigation end-->
                            </div>
                        </div>

                    </div>
                </div>
            </div>
            <!--ttm-header-wrap end -->
            <!--rev-slider -->

            <!--rev-slider end-->
        </header>

        <div>
          <img src="8.07.2019_new.jpg">
        </div>
        <!--header end-->

        <!--site-main start-->



</div><!-- page end -->

所以在标题导航菜单之后，图像会显示，但问题是图像在屏幕上不正确，它的一些内容隐藏并且只显示图像的中间部分。谁能告诉我如何正确调整图像？

Answer 1

问题不够明确，无法回答。如果你想让你的图片作为标题的背景，你应该在你的 CSS 中将它作为背景图片。

header {
 background: url();
}

但是如果你想让它填满你的导航栏，最好让它的高度和宽度为它的容器的100%。也许你可以解释更多，这样我就可以帮助你解决这个问题。