如何将我的背景图像扩展到整个屏幕

how to stretch my background image to whole screen?

本文关键字:扩展到 屏幕 图像 背景 我的      更新时间:2023-09-26

我尝试了几种不同的方法,但不幸的是,我找不到解决方案这是我页面的外观https://i.stack.imgur.com/xCAxY.png
这是我的CSS

.first{
 padding-top:0px;
    padding-bottom: 0px; 
background: url('../image/background.jpg');
background-attachment:fixed;
    background-repeat:no-repeat;
   background-size:100% 100%;
    background-position: center;
     position: absolute;
}

这是代码

<div class="first">
 
    <div class="jumbotron" style="margin-left:0px;">
        <h1>ASP.NET</h1>
        <p class="lead">ASP.NET is a free web framework for building great Web sites and Web applications using HTML, CSS and JavaScript.</p>
        <p><a href="http://asp.net" class="btn btn-primary btn-lg">Learn more &raquo;</a></p>
    </div>
    <div class="row">
        <div class="col-lg-4">
            <h2>Getting started</h2>
            <p>
                ASP.NET MVC gives you a powerful, patterns-based way to build dynamic websites that
                enables a clean separation of concerns and gives you full control over markup
                for enjoyable, agile development.
            </p>
            <p><a class="btn btn-default" href="http://go.microsoft.com/fwlink/?LinkId=301865">Learn more &raquo;</a></p>
        </div>
        <div class="col-lg-4">
            <h2>Get more libraries</h2>
            <p>NuGet is a free Visual Studio extension that makes it easy to add, remove, and update libraries and tools in Visual Studio projects.</p>
            <p><a class="btn btn-default" href="http://go.microsoft.com/fwlink/?LinkId=301866">Learn more &raquo;</a></p>
        </div>
        <div class="col-lg-4">
            <h2>Web Hosting</h2>
            <p>You can easily find a web hosting company that offers the right mix of features and price for your applications.</p>
            <p><a class="btn btn-default" href="http://go.microsoft.com/fwlink/?LinkId=301867">Learn more &raquo;</a></p>
        </div>
    </div>
</div>

您几乎没有提供任何进一步的信息。如果CSS应用在body上,请确保html和body上的最小高度为100%,也许您正在寻找背景大小:cover属性。

width: 100vh
height: 100vh

background-size: cover