HTML和ASP.NET

Question

I created a master page and copied the html from another website and i want to use its design on my master page. 我创建了一个母版页，并从另一个网站复制了html，我想在其母版页上使用其设计。 I got the design in order by my issues comes when clicking the link. 单击链接后，我的问题按顺序得到了设计。 When the app starts, i click a link and it navigates to that link. 应用启动时，我单击一个链接，然后导航到该链接。 If i want to navigate to another link, it adds the folder name to my other page location. 如果我想导航到另一个链接，它将文件夹名称添加到我的其他页面位置。 the example is blow: 这个例子很打击：

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

page 1 - now if want to navigation to another page this is what happens in the url 第1页-现在，如果要导航到另一页，这就是网址中发生的情况

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

the actual location of this second page is /Payroll/InitiatePayroll.aspx 第二页的实际位置是/Payroll/InitiatePayroll.aspx

I dont get what this is happening, some help please. 我不知道这是怎么回事，请帮忙。 thank you 谢谢

<%@ 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>

this is my master page. 这是我的主页。

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; }

this is my css class 这是我的CSS课

Answer 1

The tilde ~ as suggested by others can only be used in server controls to render relative to the root. 其他人建议的波浪号〜只能在服务器控件中用于相对于根渲染。 Try changin the links to server controls 尝试更改服务器控件的链接

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

Answer 2

The URL is being resolved relative to the current folder. 正在相对于当前文件夹解析URL。

Change your payroll link to one of the following: 将您的工资单链接更改为以下之一：

<li><a href="~/Payroll/InitiatePayroll.aspx">Payroll</a></li> (resolve relative to the root) <li><a href="~/Payroll/InitiatePayroll.aspx">Payroll</a></li> （相对于根解析）

<li><a href="../Payroll/InitiatePayroll.aspx">Payroll</a></li> (resolve as sibling of current folder) <li><a href="../Payroll/InitiatePayroll.aspx">Payroll</a></li> （解析为当前文件夹的同级）

Answer 3

Try using asp:HyperLink s instead of just plain a s: 尝试使用asp:HyperLink而不是单纯a s：

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

The server control will resolve a client url with the root where the tilde is. 服务器控件将使用代字号所在的根来解析客户端URL。

HTML和ASP.NET

问题描述

3 个解决方案

解决方案1
1 2013-02-28 15:40:52

解决方案2
0 2013-02-28 15:38:00

解决方案3
0 2013-02-28 15:42:13

HTML和ASP.NET

问题描述

3 个解决方案

解决方案1 1 2013-02-28 15:40:52

解决方案2 0 2013-02-28 15:38:00

解决方案3 0 2013-02-28 15:42:13

解决方案1
1 2013-02-28 15:40:52

解决方案2
0 2013-02-28 15:38:00

解决方案3
0 2013-02-28 15:42:13