Css 如何使左菜单高度动态化
我在asp.net中使用母版页,我是CSS中的noob,因此尝试了很多 在搜索google和stackoverflow帖子后也会有属性,但我不能 想办法解决这个问题,除了左边的问题外,一切都很顺利 侧菜单,它应该采取所有的页面高度动态,在年底我有 包括产品页面截图(buy.aspx)、产品T2和所有其他 它下的所有产品都与类别保持一致,而它们本应保持一致 在页面的第一个产品下对齐,plz帮助 母版页Css 如何使左菜单高度动态化,css,master-pages,Css,Master Pages,我在asp.net中使用母版页,我是CSS中的noob,因此尝试了很多 在搜索google和stackoverflow帖子后也会有属性,但我不能 想办法解决这个问题,除了左边的问题外,一切都很顺利 侧菜单,它应该采取所有的页面高度动态,在年底我有 包括产品页面截图(buy.aspx)、产品T2和所有其他 它下的所有产品都与类别保持一致,而它们本应保持一致 在页面的第一个产品下对齐,plz帮助 母版页 <%@ Master Language="C#" AutoEventWireup="tru
<%@ Master Language="C#" AutoEventWireup="true" CodeBehind="Site.master.cs" Inherits="E_Auction.Site" %>
<html>
<head runat="server">
<style type="text/css">
body
{
margin-top: 0px;
margin-left: 5%;
margin-right: 5%;
background-color: Teal;
}
#header {
padding: 1px;
margin-left:5%;
margin-right:5%;
background-color: White;
margin-bottom: 0px;
}
#left {
float:left;
margin-left: 5%;
background-color:White;
}
#center
{
margin-top: 0px;
background-color: White;
margin-left: 5%;
margin-right: 5%;
overflow:scroll;
}
.style1
{
text-align: center;
}
.internal
{
text-decoration: none;
}
a:link, a:hover, a:visited, a:active {color: blue;}
</style>
<asp:ContentPlaceHolder ID="head" runat="server">
</asp:ContentPlaceHolder>
</head>
<body>
<form id="form1" runat="server">
<div id="header" style="background-image:url(Images/banner.gif);background-repeat:no-repeat;">
<table style="height:27%;width:88%">
<tr colspan="2">
<td style="text-align: right">
<asp:LinkButton ID="lnkMyAccount" runat="server" PostBackUrl="~/account.aspx" ForeColor="White" Font-Bold="true" Font-Underline="false">My Account</asp:LinkButton>  
<asp:LinkButton ID="lnkBuy" runat="server" PostBackUrl="~/buy.aspx" ForeColor="White" Font-Bold="true" Font-Underline="false">Buy</asp:LinkButton>  
<asp:LinkButton ID="lnkSell" runat="server" PostBackUrl="~/sell.aspx" ForeColor="White" Font-Bold="true" Font-Underline="false">Sell</asp:LinkButton>  
<asp:LinkButton ID="lnkAboutUs" runat="server" PostBackUrl="~/about.aspx" ForeColor="White" Font-Bold="true" Font-Underline="false">About Us</asp:LinkButton>  
<asp:LinkButton ID="lnkContactus" runat="server" PostBackUrl="~/contact.aspx" ForeColor="White" Font-Bold="true" Font-Underline="false">Contact Us</asp:LinkButton>
</td>
</tr>
<tr>
<td style="text-align: right">
<br /><span class="style1"><strong>Search</strong></span> <asp:TextBox ID="txtSearch" runat="server" Width="170px"></asp:TextBox> <asp:Button ID="btnGo" runat="server" Text="Go" Width="39px" Height="23px" />
</td>
</tr>
<tr>
<td valign="bottom"><asp:SiteMapPath ID="smPath" runat="server" ForeColor="White"></asp:SiteMapPath></td>
</tr>
</table>
</div>
<div id="left">
<table>
<tr>
<td valign="top" style="background-color:Silver;color:White;font-weight:bold;text-align:center;">
Category
</td>
</tr>
<tr>
<td valign="top" class="style1">
<asp:DataList ID="DataList1" runat="server" DataSourceID="dsCats">
<ItemTemplate>
<a href="buy.aspx?catid=<%# Eval("catid") %>" class="internal"><asp:Label ID="catitleLabel" runat="server" Text='<%# Eval("catitle") %>' />
</ItemTemplate>
</asp:DataList>
<asp:SqlDataSource ID="dsCats" runat="server"
ConnectionString="<%$ ConnectionStrings:EAuctionConnectionString %>"
SelectCommand="SELECT [catid], [catitle] FROM [Category]"></asp:SqlDataSource>
</td>
</tr>
</table>
</div>
<div id="center">
<asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
</asp:ContentPlaceHolder>
</div>
</form>
</body>
</html>
<%@ Page Title="" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="buy.aspx.cs" Inherits="E_Auction.buy" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
<title>E-Auction::Buy Products</title>
<style type="text/css">
.topbanners
{
border: none;
}
</style>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
<asp:ListView ID="ListView1" runat="server" DataKeyNames="prodid"
DataSourceID="SqlDataSource1">
<EmptyDataTemplate>
<span>No data to show.</span>
</EmptyDataTemplate>
<ItemTemplate>
<table width="50%">
<tr>
<td colspan="2"><strong>
<asp:Label ID="prodnameLabel" runat="server" Text='<%# Eval("prodname") %>' />
</strong></td>
</tr>
<tr>
<td rowspan="8"><img src='/Pimages/<%# Eval("prodimagename") %>' height="150px" width="150px" /></td>
</tr>
<tr>
<td align="right">
<b></strong><asp:Label ID="capcategory" runat="server" Text="Category" /></b>
<asp:Label ID="Label2" runat="server" Text='<%# Eval("cat_title") %>' /></td>
</tr>
<tr>
<td align="right">
<asp:Label ID="capbidstartprice" runat="server" Text="Bid Start Price: " visible='<%# (Convert.ToInt32(Eval("pricetype")) == 1) ? true : false %>' />
<asp:Label ID="bidstartpriceLabel" runat="server" Text='<%# Eval("bidstartprice") %>' visible='<%# (Convert.ToInt32(Eval("pricetype")) == 1) ? true : false %>' /></td>
</tr>
<tr>
<td align="right">
<asp:Label ID="captotalbids" runat="server" Text="Total Bids: " visible='<%# (Convert.ToInt32(Eval("pricetype")) == 1) ? true : false %>' />
<asp:Label ID="totalbids" runat="server" Text='<%# Eval("TotalBids") %>' visible='<%# (Convert.ToInt32(Eval("pricetype")) == 1) ? true : false %>'/>
</tr>
<tr>
<td align="right">
<asp:Label ID="capbidenddate" runat="server" Text="Bid Ends At: " visible='<%# (Convert.ToInt32(Eval("pricetype")) == 1) ? true : false %>' />
<asp:Label ID="bidenddate" runat="server" Text='<%# Eval("bidenddate") %>' visible='<%# (Convert.ToInt32(Eval("pricetype")) == 1) ? true : false %>'/>
</tr>
<tr>
<td align="right">
<asp:Label ID="capbuyprice" runat="server" Text="Buy Price: " visible='<%# (Convert.ToInt32(Eval("pricetype")) == 0) ? true : false %>' />
<asp:Label ID="buyprice" runat="server" Text='<%# Eval("buyprice") %>' visible='<%# (Convert.ToInt32(Eval("pricetype")) == 0) ? true : false %>'/>
</tr>
<tr>
<td align="right">
<asp:Label ID="captax" runat="server" Text="Tax: " visible='<%# (Convert.ToInt32(Eval("pricetype")) == 0) ? true : false %>' />
<asp:Label ID="tax" runat="server" Text='<%# Eval("tax") %>' visible='<%# (Convert.ToInt32(Eval("pricetype")) == 0) ? true : false %>'/>
</tr>
<tr>
<td align="right">
<asp:Label ID="captotalbuyprice" runat="server" Text="Total: " visible='<%# (Convert.ToInt32(Eval("pricetype")) == 0) ? true : false %>' />
<asp:Label ID="totalbuyprice" runat="server" Text='<%# Eval("TotalBuyPrice") %>' visible='<%# (Convert.ToInt32(Eval("pricetype")) == 0) ? true : false %>'/>
</tr>
<tr>
<td align="right">
<a href='buyform.aspx?id=<%# Eval("prodid") %>' class="internal">
<asp:Image ID="Image1" ImageUrl='/Images/buy.png' runat="server" Visible='<%#(Convert.ToInt32(Eval("pricetype")) == 0) ? true : false%>' CssClass="topbanners"/>
</a>
<a href='bidform.aspx?id=<%# Eval("prodid") %>' class="internal">
<asp:Image ID="Image2" ImageUrl='/Images/bid.png' runat="server" Visible='<%#(Convert.ToInt32(Eval("pricetype")) == 1) ? true : false%>' CssClass="topbanners"/>
</a>
</td>
</tr>
<tr colspan="2">
<td><b>Description</b><br /><asp:Label ID="Label5" runat="server" Text='<%# Eval("description") %>' />
</tr>
</table>
<br />
</ItemTemplate>
<LayoutTemplate>
<div ID="itemPlaceholderContainer" runat="server" style="">
<span runat="server" id="itemPlaceholder" />
</div>
<div style="">
<p align="center">
<asp:DataPager ID="DataPager1" runat="server">
<Fields>
<asp:NextPreviousPagerField ButtonType="Button" ShowFirstPageButton="True"
ShowNextPageButton="False" ShowPreviousPageButton="False" />
<asp:NumericPagerField />
<asp:NextPreviousPagerField ButtonType="Button" ShowLastPageButton="True"
ShowNextPageButton="False" ShowPreviousPageButton="False" />
</Fields>
</asp:DataPager>
</p>
</div>
</LayoutTemplate>
</asp:ListView>
<br />
<asp:SqlDataSource ID="SqlDataSource1" runat="server"
ConnectionString="<%$ ConnectionStrings:EAuctionConnectionString %>"
SelectCommand="SELECT [prodid], (Select catitle from Category where catid=p.catid) as cat_title,[prodname],[description],[pricetype],[buyprice],[tax],[bidstartprice],[bidenddate],[prodimagename],[isforsale],[addedon], [btnname], (Select count(prod) from Bid where prod=p.prodid) as TotalBids, (tax+buyprice) as TotalBuyPrice FROM Product p where isforsale=1 Order by addedon Desc">
</asp:SqlDataSource>
<table runat="server" id="tblAll" width="70%" align="center">
</table>
</asp:Content>
身体
{
边际上限:0px;
左缘:5%;
保证金权利:5%;
背景色:青色;
}
#标题{
填充:1px;
左缘:5%;
保证金权利:5%;
背景色:白色;
边缘底部:0px;
}
#左{
浮动:左;
左缘:5%;
背景色:白色;
}
#居中
{
边际上限:0px;
背景色:白色;
左缘:5%;
保证金权利:5%;
溢出:滚动;
}
.style1
{
文本对齐:居中;
}
.内部
{
文字装饰:无;
}
a:link,a:hover,a:visted,a:active{color:blue;}
说明
产品页面的图像:
您需要在左侧菜单中添加100%的高度属性。但不仅如此,您还需要在html、body和任何其他容器元素上设置一个高度。如果你把这些都设置为100%,那就可以了
height:100%;
谢谢,它做得很好,但不是很充分,很难让所有决议的事情看起来相似。然而,它确实让我学到了答案。