Question

我在页面上创建了一些按钮，现在想在按钮上添加全尺寸图片。

<table>
    <tr>
            <th>
                    <button type="button1" class="btn btn-default" onclick="openInDialog()">
                    <span align="right" class="glyphicon glyphicon-plus" aria-hidden="true" ></span> Finance & BD&L
                    </button>
            </th>

            <th>
                    <button type="button1" class="btn btn-default" onclick="openInDialog2()">
                    <span align="right" class="glyphicon glyphicon-plus" aria-hidden="true" ></span> Market Access
                    </button>
            </th>   
            <th>
                    <button type="button1" class="btn btn-default" onclick="openInDialog3()">
                    <span class="glyphicon glyphicon-plus" aria-hidden="true" ></span> Business Excellence & Commercial operations 
                    </button>
            </th>


            <th>
                    <button type="button1" class="btn btn-default" onclick="openInDialog4()">
                    <span class="glyphicon glyphicon-plus" aria-hidden="true" ></span> Legal & Compliance
                    </button>
            </th>   

    <tr>
            <th>
                    <button type="button1" class="btn btn-default" onclick="openInDialog5()">
                    <span class="glyphicon glyphicon-plus" aria-hidden="true" ></span> Oncology BU
                    </button>
            </th>


            <th>
                    <button type="button1" class="btn btn-default" onclick="openInDialog6()">
                    <span class="glyphicon glyphicon-plus" aria-hidden="true" ></span> Hematology BU
                    </button>
            </th>

            <th>
                    <button type="button1" class="btn btn-default" onclick="openInDialog7()">
                    <span class="glyphicon glyphicon-plus" aria-hidden="true" ></span> Medical
                    </button>
            </th>

            <th>
                    <button type="button1" class="btn btn-default" onclick="openInDialog8()">
                    <span class="glyphicon glyphicon-plus" aria-hidden="true" ></span> HR
                    </button>
            </th>
    </tr>

这是我的HTML代码按钮。我已将图像加载到我网站上的“文档”页面上，并在代码中复制了URL链接，但是Content Editor仍然看不到该图像。我认为这是我在url中遇到的问题，但是我该如何解决呢？

这是CSS代码

    button [type="button1"] {
            margin-top: 5px;
            marring-left: 5px;
            padding-left: 10px;
            width: 260px; 
            height: 155px;
            background: url('https://share.novartis.net/sites/ruphoncology/Shared%20Documents/00218_300dpi_RGB.jpg');
    }

但这很重要

Answer 1

您的CSS代码应该是这样的

[type=button1] {
    margin-top: 5px;
    margin-left: 5px;
    padding-left: 10px;
    width: 260px;
    height: 155px;
    background: url('https://images.pexels.com/photos/60597/dahlia-red-blossom-bloom-60597.jpeg?auto=compress&cs=tinysrgb&h=350');
    background-size: cover;
    background-position: center;
  }

我用了另外一张图片。您替换自己的。

如何在SharePoint WebPage上创建img按钮

1 个答案: