"/> "/> -6ren">
gpt4 book ai didi

asp.net - 带有母版页的 ASP.NET 菜单中的奇怪视觉工件

转载 作者:行者123 更新时间:2023-11-28 13:40:09 24 4
gpt4 key购买 nike

我想知道为什么我会得到这个奇怪的视觉伪像?

我有一个配置了母版页的 Web 应用程序 ASP.NET 元素。母版页的顶部菜单如下所示:

<asp:Menu ID="NavigationMenu" runat="server" CssClass="menu" EnableViewState="false" IncludeStyleBlock="false" Orientation="Horizontal">
<Items>
<asp:MenuItem NavigateUrl="~/ReportPage.aspx" Text="<%$ Resources:Master, Menu_Reports %>"/>
<asp:MenuItem NavigateUrl="~/ConfigurePage.aspx" Text="<%$ Resources:Master, Menu_Configure %>"/>
<asp:MenuItem NavigateUrl="~/AboutPage.aspx" Text="<%$ Resources:Master, Menu_About %>"/>
</Items>
</asp:Menu>

样式如下:

div.menu
{
padding: 4px 0px 4px 8px;
}
div.menu ul
{
list-style: none;
margin: 0px;
padding: 0px;
width: auto;
}
div.menu ul li a, div.menu ul li a:visited
{
background-image: url("../Graphics/btngradb.png");
border: 0px solid #bc8b28;
color: #ececec;
display: block;
line-height: 1.35em;
padding: 4px 20px;
text-decoration: none;
white-space: nowrap;
margin-right: 4px;
font-size: 14px;
text-shadow: 1px 1px 1px #7a550e;
}
div.menu ul li a:hover
{
background-image: url("../Graphics/btngradg.png");
border-bottom-color: #719b14;
color: #ececec;
text-decoration: none;
}
div.menu ul li a:active
{
background-color: #a1ca56;
color: #000000;
text-decoration: none;
}

发生的事情是,当页面在网络浏览器中加载时,我得到了垂直显示的菜单,就像它在这个屏幕截图上显示的那样:

http://i150.photobucket.com/albums/s99/dc2000_bucket/menu_bug.png

一瞬间它切换到我想要的方式 - 水平(上面链接中的顶部图片。)

有人可以告诉我我做错了什么以及如何解决吗?

最佳答案

在浏览器加载您的 css 时听起来好像有某种延迟。

您的样式表/css 在页面标记中的什么位置?

你应该尝试将它放在 <head> 中的“高层”尽可能标记,最好在 <title></title> 之后在任何 <script> 之前标签。

http://developer.yahoo.com/performance/rules.html#css_top

更新:仔细查看您的 CSS 后,我认为您需要更改 display: blockdisplay: inline-block . display: block可能是导致初始垂直布局的原因,然后(我假设)某种 ASP.NET 注入(inject)菜单 javascript 正在修复它(因为您指定了 Orientiation="Horiztonal")。只是一个猜测。

关于asp.net - 带有母版页的 ASP.NET 菜单中的奇怪视觉工件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8018076/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com