css - 使用CSS在单选按钮列表中的单选按钮上放置listitem.text

我正在使用单选按钮，因为它使绑定项目和控制动态事件变得非常容易。

我的问题是隐藏在ListItem.Text左侧或右侧的RadioButtonList ListItem“圆圈”。

我将每个ListItem.Text属性设置为HTML <img>.

我希望RadioButtonList仅在RadioButtonList列表中显示ListItem.Text属性，而在其旁边没有单选按钮圆圈。经过一番研究，我意识到我无法隐藏单选按钮的ListItem圆圈，而不隐藏整个单选按钮列表。

因此，我的第二个选择是通过CSS将ListItem.Text放置在RadioButtonList ListItem“圆圈”的顶部。这是我到目前为止尝试过的，但是我的CSS技能恐怕很松弛:(

noPizzaMod.Text = "<img src=\"image.png \" />";
noPizzaMod.Attributes.CssStyle.Add("float", "left");
noPizzaMod.Attributes.CssStyle.Add("padding","0 1em");
noPizzaMod.Attributes.CssStyle.Add("text-align", "center");
rdo_pizzamods.Items.Add(noPizzaMod);

结果：刚刚在单选按钮ListItem Circle的左侧添加了填充。

同样，当前的任务是将ListItem.Text（图片元素）浮动在RadioButtonList ListItem“圆圈”的顶部

感谢您的时间！

PS：我尝试过的另一件事是使用JQuery进行显示：没有单选按钮列表项，但是当然隐藏了文本以及整个单选按钮列表:(

作为最后的选择，我可以为复选框切换到togglebuttonextender，但这将包括对我们的显示机制的重新设计。希望有一个简单的解决方案，其中一位上师可以将我指向那里！

编辑：

我只是有一个asp：Panel，我在后面的代码中动态添加了RadioButtonList。

<asp:Panel ID="pnl_pizzamods" runat="server"></asp:Panel>

像这样

ListItem PizzaMod = new ListItem();
noPizzaMod.Text = "<img src=\"image.png \" />";
noPizzaMod.Attributes.CssStyle.Add("float", "left");
noPizzaMod.Attributes.CssStyle.Add("padding","0 1em");
noPizzaMod.Attributes.CssStyle.Add("text-align", "center");
rdo_pizzamods.Items.Add(noPizzaMod);
pnl_pizzamods.Controls.Add(rdo_pizzamods);

我还在后台添加了自定义动态事件处理程序和许多其他mojo，这使RadioButtonList数据绑定易于控制。我确信它不会影响视觉布局！再一次感谢你的帮助！

最佳答案

您是否尝试过简单地隐藏单选按钮？

input[type='radio'] { visibility: hidden; }

小提琴：http://jsfiddle.net/kboucher/8GaV5/

关于css - 使用CSS在单选按钮列表中的单选按钮上放置listitem.text，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/12586539/