如何在缩进列表旁边垂直排列复选框？ [英] How do I line up checkboxes vertically beside an indented list?
问题描述
我想拥有一组嵌套的UL元素，其中每个LI都有一个与之关联的
复选框，复选框全部排成一行
垂直于列表的左侧或右侧。在其他
字样中，这样的话（如果你没有使用固定的
宽度字体，我很抱歉）：
x - 项目1
x - 项目1a
x - 项目1b
x - 项目2
x - 项目2a
x - 项目2a1
或，
- 项目1 x
- 项目1a x
- 项目1b x
- 项目2 x
- 项目2a x
- 项目2a1 x
我希望每个复选框与其列表元素相关联 - 在其他
字样中，我不想让列表项全部合二为一div和
复选框都在它旁边的一个单独的div中，因为那时它们可能没有正确排列 - 这个列表不会像
复选框。
我怎么能这样做？
I want to have a set of nested UL elements where every LI has a
checkbox associated with it, and the checkboxes are all lined up
vertically either to the left or the right of the list. In other
words, something like this (my apologies if you''re not using a fixed-
width font):
x - Item 1
x - Item 1a
x - Item 1b
x - Item 2
x - Item 2a
x - Item 2a1
or,
- Item 1 x
- Item 1a x
- Item 1b x
- Item 2 x
- Item 2a x
- Item 2a1 x
I want each checkbox to be associated with its list element - in other
words, I don''t want to have the list items all in one div, and the
checkboxes to be all in a separate div beside it, because then they
might not line up properly - the list wouldn''t be as tall as the
checkboxes.
How could I go about doing this?
推荐答案
Scripsit Brian Kendig：
Scripsit Brian Kendig:
我想拥有一组嵌套的UL元素，其中每个LI都有一个与之关联的
复选框，并且复选框都排成一行
垂直于列表的左侧或右侧。
I want to have a set of nested UL elements where every LI has a
checkbox associated with it, and the checkboxes are all lined up
vertically either to the left or the right of the list.
这可能是一种错误的方法，无论原始问题是什么。我会建议您先描述原始问题或目标，然后用b * b来说明您当前使用URL的方法。基本上，CSS只是
可选样式，所以在你开始考虑使用
页面的CSS问题之前，你应该有一个页面，有效和逻辑标记，所以
你自然会用你的问题发布网址。
This might be a wrong approach, whatever the original problem was. I''d
suggest that you start with describing the original problem or goal and
illustrate your current approach with a URL. Basically, CSS is just about
optional styling, so before you even start considering CSS issues with a
page, you should have a page written, with valid and logical markup, so that
you naturally post the URL with your question.
其他
字样，像这样的东西（如果你没有使用固定宽度的
字体，我很抱歉）：
In other
words, something like this (my apologies if you''re not using a fixed-width
font):
没有为遗漏URL而道歉。
No apology granted for the omission of a URL.
x - Item 1
x - Item 1a
x - Item 1b
x - 项目2
x - 项目2a
x - 项目2a1
x - Item 1
x - Item 1a
x - Item 1b
x - Item 2
x - Item 2a
x - Item 2a1
那可能会令人困惑， _both_ list bullets _and_ checkboxes。它会b / b
（这样的方法是可行的）可能更好地压制列表项目符号，并让复选框也扮演他们的角色，除了
是输入元素。
That''ll probably be confusing, with _both_ list bullets _and_ checkboxes. It
would (_if_ the approach as such is feasible) probably be better to suppress
the list bullets and let the checkboxes play their role too, in addition to
being input elements.
我希望每个复选框与其列表元素相关联 - 在其他
字中，我我不想把列表项全部放在一个div中，并且
复选框都在它旁边的一个单独的div中，因为那时它们
可能不行正确 - 列表不会像
复选框一样高。
I want each checkbox to be associated with its list element - in other
words, I don''t want to have the list items all in one div, and the
checkboxes to be all in a separate div beside it, because then they
might not line up properly - the list wouldn''t be as tall as the
checkboxes.
对不起，但这个描述太模糊了，而且很难看到你尝试过的
。自然标记只有ul，li，label和
输入元素而且没有div。
复选框的垂直位置可能很棘手，但这是关于它，或者
别的东西？
-
Jukka K. Korpela（Yucca）
http://www.cs.tut.fi/~jkorpela/
Sorry, but that''s too vague a description, and it''s very difficult to see
what you have tried. The natural markup would have just ul, li, label, and
input elements and no div.
Vertical placement of checkboxes can be tricky, but is this about it, or
something else?
--
Jukka K. Korpela ("Yucca")
http://www.cs.tut.fi/~jkorpela/
我建议您先描述原始问题或目标，然后再按
I''d suggest that you start with describing the original problem or goal and
用URL说明您当前的方法。
illustrate your current approach with a URL.
最初的问题是我有一个项目层次结构需要
能够被选中或取消选中复选框，而我希望
复选框垂直排列整齐。
这是一个显示我想要完成的内容的URL。
http://www.enchanter.net/listfoo.png
Brian Kendig< br *** @ enchanter.netwrites：
Brian Kendig <br***@enchanter.netwrites:
我建议你先描述一下原来的问题或目标，然后使用URL来说明你当前的方法。
I''d suggest that you start with describing the original problem or goal and
illustrate your current approach with a URL.
最初的问题是我有一个项目层次结构需要
能够被选中或取消选中复选框，而我希望
复选框垂直排列整齐。
The original problem is that I have a hierarchy of items which need to
be able to be selected or deselected with checkboxes, and I want the
checkboxes lined up vertically for neatness.
你真的想要吗？排在右边，如果物品很长，那么很难看出哪个复选框
对应其他物品。如果在左侧并且UL的嵌套深度很大，则同样适用。
Do you really want that? Lined up on the right, if one of
the items is long, it can be hard to see which checkbox
corresponds to the other items. If on the left and the
depth of nesting of ULs is large, the same thing applies.
这是一个显示内容的URL我正在努力完成。
http：// www.enchanter.net/listfoo.png
您提供付款的照片还有5英镑的钞票，我想是吗？
-
J？3n Fairbairn Jo *** ********@cl.cam.ac.uk
You offer payment with pictures of ?￡5 notes, too, I suppose?
--
J?3n Fairbairn Jo***********@cl.cam.ac.uk
这篇关于如何在缩进列表旁边垂直排列复选框？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
