在CSS中拉伸背景图像

Question

可能重复:
拉伸和缩放CSS图像背景 - 仅限CSS

一个初学者问题:这可能是一个基本问题,我可能会遗漏一些基本想法.我已经看到了这个问题,但我认为这不是我的问题.我想在CSS中拉伸我的背景图像.这是我的CSS代码
CSS:

.BackgroundColor
{
    background-position: center center;
    margin: 0px 0px 0px 0px;
    background-image: url('Content/Tulips.jpg');//this image i want to stretch
    background-repeat: no-repeat;
    width: 1000px;
    height: 1000px;
    padding: 0px 0px 0px 0px;
}

这是我的HTML代码
HTML:

<div class="BackgroundColor">
    <div class="outerMost">
    <div class="heading" id="loginheading">
      Show Login  
    </div>
    <div class="MainSect">
        <div class="Label">
        <asp:Label ID="usernameLabel" runat="server" Text="UserName" ClientIDMode="Static"></asp:Label>
        </div>
        <asp:TextBox ID="UsernameTextBox" runat="server" CssClass="textboxes" ClientIDMode="Static"></asp:TextBox>
        <br />
        <asp:Label ID="PasswordLabel" runat="server" Text="Password" CssClass="Label" ClientIDMode="Static"></asp:Label>
        <asp:TextBox ID="TextBox2" runat="server" CssClass="textboxes"></asp:TextBox>
        <br />
        <asp:Button ID="LoginButton" runat="server" Text="Login"  
            BackColor="#00CCFF" BorderStyle="Solid" CssClass="loginButton" ClientIDMode="Static" />

    </div>
    <br />
    <br />
    <div>
        <asp:Label ID="Label1" runat="server" Text="Date of Birth" CssClass="Label"></asp:Label>
        <asp:TextBox ID="CalenderTextBox" runat="server" ClientIDMode="Static" CssClass="textboxes"></asp:TextBox>
    </div>
    <div id="tabSection">
        <ul>

            <li><a href="#basicInfo">Basic info</a></li>
            <li><a href="#Products">Products</a></li>
            <li><a href="#SavingAccount">Depositer</a></li>
        </ul>
        <div id="basicInfo">
        Basic Info will be mentioned here and bla bla bla
        </div>
        <div id="Products">
        Products and other releases should be mentioned here

        </div>
        <div id="SavingAccount">
        Information about saving account should be mentioned here and bla bla bla
        </div>
    </div>
    </div>
    </div>

所以我想在页面上设置背景图像.忽略内部代码.请帮助我拉伸图像,因为我Style builder没有显示任何有关拉伸图像的属性.我提到的上述链接是在Html中扩展图像,但我想在CSS中进行.
编辑: 请告诉我如何在Visual Studio中包含CSS3,因为我的CSS编辑器显示CSS2.1
谢谢

Answer 1

在CSS3,你可以简单地使用background-size: cover记录在这里.

封面:缩放图像,同时保持其固有的宽高比(如果有的话),使其最小尺寸,使其宽度和高度都可以完全覆盖背景定位区域.

否则看到这个答案.

Answer 2

我认为这就是你要找的东西:

background-size: 100%;