asp.net - HTML 和 ASP.NET

Question

我创建了一个母版页并从另一个网站复制了 html，我想在我的母版页上使用它的设计。单击链接时，我的问题出现了，我按顺序得到了设计。当应用程序启动时，我单击一个链接并导航到该链接。如果我想导航到另一个链接，它会将文件夹名称添加到我的另一个页面位置。这个例子是打击：

http://mydomain.com/AdminSetup/Financial/AddIncome.aspx

第 1 页 - 现在如果要导航到另一个页面，这就是 url 中发生的情况

http://mydomain.com/AdminSetup/Financial/Payroll/InitiatePayroll.aspx

第二页的实际位置是/Payroll/InitiatePayroll.aspx

我不明白这是怎么回事，请帮忙。谢谢你

<%@ Master Language="VB" AutoEventWireup="false" CodeBehind="SSP.master.vb" Inherits="SSPayroll.SSP" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <title>Free template built by slicejack.com</title>

<link type="text/css" media="screen" rel="stylesheet" href="stylesheets/reset.css" />
<link type="text/css" media="screen" rel="stylesheet" href="stylesheets/main.css" />
    <asp:ContentPlaceHolder ID="head" runat="server">
    </asp:ContentPlaceHolder>
</head>
<body>
    <form id="form1" runat="server">
    <div id="header">
  <h1><a href="Default.aspx">Company logo</a></h1>
  <ul>
    <li><a href="Default.aspx" class="active">Home</a></li>
    <li><a href="Payroll/InitiatePayroll.aspx">Payroll</a></li>
    <li><a href="~/AdminSetup/Financial/AddIncome.aspx">Finance</a></li>
    <li><a href="interior.html">Testimonials</a></li>
    <li><a href="interior.html">Blog</a></li>
    <li><a href="interior.html">Contact</a>
      </li>
  </ul>
</div>
<!-- //#header -->
<div id="sub-header">
  <div id="sub-header-inner">
    <h2>Free high quality template</h2>
    <p class="highlight">The template is made by following the latest web standards.
      PSD Files are available upon request. </p>
    <p>This website is ideal for representing a product or service. Its code is descriptive so that is understandable even to those who don't have good knowledge of web technology. All of the images are optimized for web and website will display correctly in all web browsers.</p>
    <p class="learn-more"><a href="interior.html">Learn more</a></p>
    <img src="images/layout/sub_header_img.png" alt="" /> </div>
</div>
<!-- //#sub-header -->

<div id="content" class="clearfix">
  <div id="content-inner">

        <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">

        </asp:ContentPlaceHolder>

</div>
<!-- //#content -->

<div id="footer">
  <ul>
    <li><a href="Default.aspx" class="active">Home</a></li>
    <li><a href="Payroll/InitiatePayroll.aspx">Payroll</a></li>
    <li><a href="interior.html">Services</a></li>
    <li><a href="interior.html">Testimonials</a></li>
    <li><a href="interior.html">Blog</a></li>
    <li><a href="interior.html">Contact</a></li>
  </ul>
  <p>Website designed by: <a href="http://www.agilo.hr">Agilo</a>, Code: <a href="http://www.slicejack.com" title="PSD to (X)HTML service">Slicejack</a></p>
</div>
<!-- //#footer -->

    </form>
</body>
</html>

这是我的母版页。

body { background: #fff url(../images/layout/body.gif) top center no-repeat; font-family: Arial, Helvetica, sans-serif; }

#header { width: 960px; margin: 0 auto; height: 118px; position: relative; }
#header h1 { padding-top: 29px; }
#header h1 a { background: url(../images/layout/logo.png) no-repeat; display: block; text-indent: -5000px; width: 156px; height: 22px; }

#header fieldset { background: url(../images/layout/search.png) no-repeat; width: 181px; height: 25px; position: absolute; right: 0; top: 26px; }
#header fieldset .search { background: none; font-size: 11px; display: block; color: #969696; border: none; padding: 0 8px 0 8px; width: 138px; margin-top: 5px;  }

#header ul { position: absolute; top: 88px; left: 0; }
#header ul li { display: inline; }
#header ul li a { font-size: 11px; text-decoration: none; text-transform: uppercase; margin-right: 20px; color: #fff; }
#header ul li a:hover, #header ul li a.active { color: #acfc5d; }


#sub-header { background: #7db63c url(../images/layout/sub_header.gif) top repeat-x; color: #fff; height: 281px; }
#sub-header-inner { width: 960px; margin: 0 auto; padding: 34px 0; position: relative; }
#sub-header h2 { background: url(../images/headings/main.png) no-repeat; width: 298px; height: 23px; margin-bottom: 12px; text-indent: -5000px; }
#sub-header p { margin-bottom: 18px; width: 610px; font-size: 13px; line-height: 1.5; }
#sub-header p.highlight { font-size: 16px; }
#sub-header p.learn-more { margin: 0; }
#sub-header p.learn-more a { display: block; text-align: center; font-size: 13px; color: #fff; background: url(../images/buttons/learn_more.png) no-repeat; height: 27px; width: 105px; text-decoration: none; padding-top: 4px; }
#sub-header p.learn-more a:hover { background-position: right; }
#sub-header img { position: absolute; right: 0; top: 30px; }

#sub-header.interior { height: 142px; background: url(../images/layout/sub_header_interior.gif) repeat-x; }
#sub-header.interior p { width: auto; }
#sub-header.interior #sub-header-inner { padding: 30px 0 0 0; }

#sub-header.interior h2 { background: url(../images/headings/interior.png) no-repeat; }


#content { background: url(../images/layout/content.gif) top repeat-x; margin-bottom: 20px; }
#content-inner { width: 960px; margin: 0 auto; padding: 30px 0; }
#content .column { width: 305px; float: left; margin-right: 20px; }
#content .column.last { margin-right: 0; }
#content .column h3 { text-indent: -5000px; height: 16px; width: 300px; margin-bottom: 8px; }
#content .column h3#about { background: url(../images/headings/about.png) no-repeat; }
#content .column h3#services { background: url(../images/headings/services.png) no-repeat; }
#content .column h3#connect { background: url(../images/headings/connect.png) no-repeat; }
#content .column p { font-size: 11px; line-height: 1.6; margin-bottom: 12px; color: #333; }
#content .column a { color: #6fa235; }
#content .column a:hover { color: #527628; }
#content .column p.read-more a { display: block; width: 95px; height: 23px; font-size: 11px; text-decoration: none; color: #360; background: url(../images/buttons/read_more.gif) left no-repeat; text-align: center; padding-top: 5px; }
#content .column p.read-more a:hover { background-position: right; }
#content .column img.left { float: left; margin: 3px 10px 0 0; padding: 1px; background: #fff; border: 2px solid #ececec; }
#content .column strong { font-weight: bold; }
#content .column em { font-style: italic; }

#content .column.main { width: 600px; }
#content .column.main h2, #content .column.main h3, #content .column.main h4, #content .column.main h5 { margin-bottom: 12px; font-weight: bold; color: #333; }
#content .column.main h2 { text-indent: -5000px; height: 15px; width: 590px; }
#content .column.main h2#lorem { background: url(../images/headings/lorem.png) no-repeat; }
#content .column.main h3 { text-indent: 0; font-size: 14px; }
#content .column.main h4 { font-size: 12px; }
#content .column.main h5 { font-size: 11px; }
#content .column.main table { width: 100%; border: 1px solid #e3e3e3; font-size: 11px; margin-bottom: 12px; }
#content .column.main table th { padding: 6px 10px; border: 1px solid #e3e3e3; font-weight: bold; color: #6fa235; }
#content .column.main table td { padding: 6px 10px; border: 1px solid #e3e3e3; color: #333; }
#content .column.main table .odd { background: #fafafa; }
#content .column.main ul li { font-size: 11px; margin-left: 25px; list-style: disc; }

#content .column.sidebar { width: 310px; float: right; margin-right: 0; }
#content .column.sidebar h3 { text-indent: -5000px; height: 15px; width: 310px; }
#content .column.sidebar h3#example { background: url(../images/headings/example.png) no-repeat; }
#content .column.sidebar h3#touch { background: url(../images/headings/touch.png) no-repeat; }
#content .column.sidebar p { color: #666; }
#content .column.sidebar p.read-more { margin-bottom: 20px; }
#content .column.sidebar fieldset label { font-size: 11px; display: block; margin-bottom: 5px; color: #666; }
#content .column.sidebar fieldset li { margin-bottom: 10px; }
#content .column.sidebar fieldset .text, #content .column.sidebar fieldset textarea { border: 1px solid #e3e3e3; -webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px; padding: 3px; font-size: 11px; color: #666; width: 202px; }
#content .column.sidebar fieldset .text:hover, #content .column.sidebar fieldset textarea:hover { border: 1px solid #c5c4c4; }
#content .column.sidebar fieldset textarea { height: 90px; width: 302px; }
#content .column.sidebar fieldset .button { background: url(../images/buttons/read_more.gif) no-repeat; width: 95px; height: 28px; text-align: center; color: #360; font-size: 11px; border: none; cursor: pointer; }
#content .column.sidebar fieldset .button:hover { background-position: right; }


#footer { clear: both; margin: 0 auto; width: 940px; padding: 6px 10px 12px 10px; border-top: 1px solid #e5e5e5; position: relative; }
#footer ul li { display: inline; }
#footer ul li a { font-size: 11px; text-decoration: none; color: #b5b5b5; margin-right: 12px; }
#footer ul li a.active, #footer ul li a:hover { color: #6b9f3c; }
#footer p { position: absolute; right: 10px; top: 10px; font-size: 11px; color: #b5b5b5; }
#footer p a { text-decoration: none; color: #6b9f3c; }

这是我的 CSS 课

score 1 · Accepted Answer

其他人建议的波浪号 ~ 只能在服务器控件中使用以相对于根进行渲染。尝试更改服务器控件的链接

<asp:HyperLink ID="myId" CssClass="active" NavigateUrl="~/Default.aspx" runat="server">Home</asp:HyperLink>

score 0 · Accepted Answer

尝试使用asp:HyperLinks 而不是普通a的 s：

<asp:HyperLink id="hlPayroll" runat="server" 
    NavigateUrl="~/Payroll/InitiatePayroll.aspx"
    Text="Payroll"></asp:HyperLink>

服务器控件将使用波浪号所在的根解析客户端 url。

score 0 · Accepted Answer

正在相对于当前文件夹解析 URL。

将您的工资单链接更改为以下之一：

<li><a href="~/Payroll/InitiatePayroll.aspx">Payroll</a></li> （相对于根解析）

<li><a href="../Payroll/InitiatePayroll.aspx">Payroll</a></li> （解析为当前文件夹的兄弟）

asp.net - HTML 和 ASP.NET

3 回答 3

Related

Reference