微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

滚动时在主asp页面的右下角插入徽标不起作用:重叠

如何解决滚动时在主asp页面的右下角插入徽标不起作用:重叠

我有一个 asp.net 网络表单应用。

它由一个母版页和一个网络表单组成。

我试图在母版页的右下角插入一个徽标,它可以工作,但是当滚动徽标在页面正文上重叠时。

Web 表单 Default.aspx 在 contentplaceholder1 中包含一个 html 表。

在 Default.Master 中,我尝试了以下内容

<%@ Master Language="C#" AutoEventWireup="true" CodeBehind="Default.master.cs" Inherits="MyTool.Default" %>

<!DOCTYPE html>

<html>
<head runat="server">
    <Meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <link rel="shortcut icon" type="image/x-icon" href="favicon.ico" />
    <title></title>

    <link rel="stylesheet" type="text/css" href="Content/MySite.css" />

    <asp:ContentPlaceHolder ID="head" runat="server">
    </asp:ContentPlaceHolder>
</head>
<body>
    <form id="form1" runat="server">
        <asp:ScriptManager ID="ScriptManager1" runat="server"  EnableCdn="true"> <%-- To retrieve the jQuery files from CDN we enable EnableCdn --%>
            <Scripts>
                <asp:ScriptReference Name="jquery" />
            </Scripts>
        </asp:ScriptManager>
        <div>
            <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
            </asp:ContentPlaceHolder>
            <div class="logo-img">
                <img id="mylogo" src="Images/mylogo.png" >
            </div>
        </div>
    </form>
</body>
</html>

在我的 MySite.css 文件中,我有以下类

.logo-img {
    position: absolute; // also I have tried fixed and the same occurs
    right: 0px;
    bottom: 0px;
}

最初在网页表单加载时:

enter image description here

但是当使用滚动时,这不起作用,徽标与页面正文和 Default.aspx 中的表格重叠。见下面的截图:

enter image description here

此外,我还尝试更改 css 中的位置,我已将绝对替换为固定,并且得到了相同的结果。我不希望徽标在表格和页面正文中的任何对象上重叠。

解决方法

您可以在此处阅读有关 position 属性的信息:https://www.w3schools.com/css/css_positioning.asp,它会解释为什么您会看到 position: absolute 的滚动效果。如果您想将其向右移动而不影响页面上的其他元素,不妨试试 position:relative。

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。