这是我的CSS
.FrontSlideShow
{
display:block;
overflow: none;
height: 323px;
margin-bottom: 12px;
background-color:#005596;
background-image: url(/*edited*/);
background-repeat: repeat-x; width:754px; font-family: verdana; font-size:large;
color:#FFFFFF;
clear:both;
}
.FrontSlideShow .SlideShowImage
{
float: left;
vertical-align:text-bottom;
padding-right: 24px;
}
.FrontSlideShow .SlideShowSubTitle
{
vertical-align: text-bottom;
margin-bottom: 10px;
}
这是标记
<div class="FrontSlideShow">
<div class="SlideShowMainTitle">
<asp:Label ID="lblSlideTitle" runat="server"></asp:Label>
</div>
<div class="SlideShowImage">
<asp:Image ID="imgSlide" runat="server" />
</div>
<div class="SlideShowSubTitle">
<asp:Label ID="lblSlideDescription" runat="server"></asp:Label>
</div>
<asp:Button ID="btnPrev" runat="server" Text="Prev" /><asp:Button ID="btnNext" runat="server" Text="Next" />
<asp:SlideShowExtender ID="slExtender" runat="server" AutoPlay="true" Loop="true" PlayInterval="3000" TargetControlID="imgSlide" NextButtonID="btnNext" PreviousButtonID="btnPrev"
ImageTitleLabelID="lblSlideTitle" ImageDescriptionLabelID="lblSlideDescription" SlideShowServiceMethod="GetSlides" SlideShowServicePath="~/WebServices/SlideShowService.asmx">
</asp:SlideShowExtender>
<asp:Literal ID="liMarkup" runat="server"></asp:Literal>
</div>
字幕div需要位于父容器的右下角。有任何想法吗?但我能得到的是:
但我想:
答案 0 :(得分:5)
试试这个:
.FrontSlideShow {
position: relative;
}
.FrontSlideShow .SlideShowSubTitle {
position: absolute;
right : 20px;
bottom: 20px;
}
答案 1 :(得分:2)
.FrontSlideShow {
....
position:relative;
....
}
.FrontSlideShow .SlideShowSubTitle {
position:absolute;
top: 300px; // your values
left: 400px;// your values
}
这样你的文字总是一致的并且在同一个地方