[英]Asp.net Ajax Control Toolkit - toggle button on same line
我正在使用Ajax Control Toolkit中的切换按钮。
在我的页面上,我需要以下布局(全部在一行上):
切换按钮| 文字框| 纽扣 纽扣 切换按钮
问题
目前,我有这样的布局:
切换按钮| 文字框| 纽扣 纽扣
切换按钮
切换按钮代码
<asp:CheckBox ID="CheckBoxToggleTips" runat="server" AutoPostBack="true"
OnCheckedChanged="CheckBoxToggleTips_CheckedChanged" />
<ajaxToolkit:ToggleButtonExtender ID="ToggleTips" runat="server"
TargetControlID="CheckBoxToggleTips"
ImageWidth="32"
ImageHeight="32"
CheckedImageAlternateText="Hide Tips"
UncheckedImageAlternateText="Show Tips"
UncheckedImageUrl="~/Images/lightbulboff.png"
CheckedImageUrl="~/Images/lightbulbon.png" />
HTML期望
<div class="title">
<span id="mainContentPlaceHolder_LabelDepartment">A&H</span> Risks<br>
<div style="position: relative;">
<a id="mainContentPlaceHolder_CheckBoxToggleTips_ToggleButton" href="" style="position: absolute;
left: 0px; top: 0px; width: 32px; height: 32px; font-size: 32px;
background-image:url(http://localhost:10833/Images/lightbulboff.png);
background-repeat: no-repeat no-repeat;" title="Show Tips">
</a>
</div>
</div>
上面的style属性是自动生成的。 所以我的问题是我该如何使用自己的样式呢? 或者如何编辑left
和top
值?
谢谢
如果第二个ToggleButton具有与第一个相同的CSS,则没有理由为什么第二个ToggleButton应该位于第二行。 我建议使用CssClass属性,并确保它使用与第一个ToggleButton相同的类。 您很可能会用完宽度,因此请将整个内容包含在外部DIV中并适当设置宽度。 希望这可以帮助。
看起来是页面布局问题:检查缺少的结束标记</div>
希望这会有所帮助。
问候,亚历克斯
嘿,您可以像这样通过CSS解析。
#mainContentPlaceHolder_LabelDepartment{
margin:0;
padding: 2px;
width: 223px;
float:left;
height:450px;
position: relative;
}
您可以通过此示例代码制作自己的代码来设置切换按钮的样式
希望对您有帮助。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.