왜이 이상한 시각적 인공물이 나는지 궁금합니다.마스터 페이지가있는 ASP.NET 메뉴의 이상한 시각적 인공물
마스터 페이지로 구성된 웹 응용 프로그램 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 선택기의 속도를 높이는 것도 도움이 될 수 있습니다. 태그와 클래스를 결합하는 것은 클래스를 사용하는 것보다 느립니다. – jwiscarson
BTW, "ASP NET"이 아니라 "ASP.NET"입니다. –
죄송합니다, 예. 점을 잊어 버렸습니다 ... @ jwiscarson 나를 정말 괴롭히는 이유는 메뉴가 처음에는 스타일이 있지만 잘못된 방향으로 표시되는 것입니다. BTW, 아래의 조언은 도움이되지 않았다 .... :( – ahmd0