Question

我对HTML和CSS不熟悉，我知道但是我根本不擅长设计，而且我确定我想要的是可能的，但是我可以做到这一点。当我正在寻找我想要的东西时，我没有得到好的结果/搜索，所以我很难你们帮助我。（我认为它被称为响应布局？如果我错了，请纠正我）

我现在有了这个页面：

我认为看起来相当不错，但我想知道如何让它保持这样，无论分辨率如何，所以如果我裁剪浏览器窗口，我希望徽标位于两个按钮有点居中。

我的代码只是：

<img src='../../iScrape.png' style="margin-top:25%;margin-left:35%;" />
            <br />
            <input id="Button1" type="button" value="LEARN MORE"style="
        margin-top:2%;
        margin-left:34%;
        padding-left:2%;
        padding-right:2%;
        border-top-left-radius: 10px;
        border-bottom-right-radius: 10px;
        border-top-right-radius: 10px;
        border-bottom-left-radius: 10px;
        background-color:transparent;
        border-color:white;
        font-family:Verdana;
        color:white;
        " onclick="location.href='@Url.Action("About", "Home")'" />
            <input id="Button2" type="button" value="TESTING1 TWO" style="
        margin-left:2%;
        padding-left:2%;
        padding-right:2%;
        border-top-left-radius: 10px;
        border-bottom-right-radius: 10px;
        border-top-right-radius: 10px;
        border-bottom-left-radius: 10px;
        background-color:#ED5B53;
        border-color:transparent;
        font-family:Verdana;
        color:white;
        " onclick="location.href='@Url.Action("Testing1two", "Home")'" />

（这是ASP.Net项目基本模板的主体。

我想知道是否有一种简单的方法可以做我想做的事情，我确信这是因为裁剪和获取：

不是很好

Answer 1

使用程序包管理器将Bootstrap安装到VS.然后只需添加一个自定义CSS类。

然后您可以添加按钮：

<div class="container">
    <div class="row">
        <div class="center-block">
            <!-- add buttons here -->
        </div>
    </div>
</div>

您可以将背景图像添加到自定义CSS中的body类。

文档：http://getbootstrap.com/css/#helper-classes-center

ASP.Net适应布局，适应图像和按钮分辨率（响应式布局）

1 个答案: