标签: html-lists

我的系统中有一个垂直菜单,基本上由HTML ul/ liCSS样式组成(见下图).但是我不希望li比菜单更宽的项目换行,我希望它们溢出菜单底部的水平滚动条.我怎么能在CSS中这样做？

我发现了一个可能是错误的神秘问题!我的片段中有一个列表.每行都有一个按钮.列表不应响应单击但是按钮是可单击的.

为了获得点击的按钮,我创建了一个监听器并在我的片段中实现它.这是我的适配器的代码.

public class AddFriendsAdapter extends BaseAdapter {

    public interface OnAddFriendsListener {
        public void OnAddUserClicked(MutualFriends user);
    }

    private final String TAG = "*** AddFriendsAdapter ***";

    private Context context;
    private OnAddFriendsListener listener;
    private LayoutInflater myInflater;
    private ImageDownloader imageDownloader;
    private List<MutualFriends> userList;

    public AddFriendsAdapter(Context context) {
        this.context = context;
        myInflater = LayoutInflater.from(context);

        imageDownloader = ImageDownloader.getInstance(context);
    }

    public void setData(List<MutualFriends> userList) {
        this.userList = userList;

        Log.i(TAG, "List passed to the adapter.");
    }

    @Override
    public int getCount() {
        try {
            return userList.size();
        } catch …

我有一个包含在第二行的无序列表,需要在包含UL的内部水平居中.每个LI是设定的宽度和高度.我已经看到很多方法适用于单行,但是当列表包含到第二行时,我没有尝试过任何工作.如果这在IE7 +中工作将是理想的 - 感谢您的帮助.

请看这里的插图:

http://grab.by/8UIl

作为JS的相对初学者,我正在努力尝试找到解决方案.

我需要找出点击了无序列表的哪一行

<ul onclick="alert(this.clicked.line.id);">
  <li id=l1>Line 1</li>
  <li id=l2>Line 2</li>
  <li id=l3>Line 3</li>
</ul>

我真的不想为每一行添加一个onclick事件,我敢肯定必须有办法？

我有一个这样的列表:

<div>
   <ul>
     <li>one</li>
     <li>two</li>
     <li>three</li>
     <li>four</li>
   </ul>
 </div>

和以下CSS:

ul { 
     width: 160px;
     height: 100px;
     overflow: auto; 
     }
li { 
     width: 80px;
     display: inline-block;
     float: left 
     }

我正试图强制列表项从左到右显示,即

 one - two - three - four

我的问题:
这样做会给我两行,每行两个项目.

问题:
是否有CSS方法强制列表项全部在一行中,所以我可以使用水平滚动？现在如果我设置溢出:auto我只是得到垂直滚动条,我不想要.

我不想在包装div上设置它.我只是好奇我是否可以单独使用列表中的CSS解决方案.

感谢帮助!

我想传递<li> id or value的onclick事件.这是我现有的代码.

<li onclick="getPaging(this.value)" id="1" value="1">1</li>
<li onclick="getPaging(this.value)" id="2" value="2">2</li>

这是javascript代码

function getPaging(str)
{
$("#loading-content").load("dataSearch.php?"+str, hideLoader);
}

我在CSS中找到了关于list-style-type属性的文章,但它没有列出· (·)作为选项,而不是默认disc或• (•).有没有办法用HTML或CSS做到这一点？

我有一个项目列表,我想要适合垂直约束的空间:

<ul>
    <li>One</li>
    <li>Two</li>
    <li>Three</li>
    <li>Four</li>
    <li>Five</li>
    <li>Six</li>
</ul>

由于我不希望列表具有超过特定高度,但我可以自由地将其水平扩展,我想将列表分成列,如下所示:

One    Two     Three
Four   Five    Six

或者,(在我的情况下,顺序并不重要)

One    Three   Five
Two    Four    Six

css属性column-count允许将列表分成列,但它只接受固定数量的列.我不知道我将拥有的项目数量(它可以从1到超过40),所以如果我将列数设置为3,任何超过6项的列表都会太高,并且如果只有4个项目,那么只有第一列有两个项目,看起来不均匀.

所以,理想情况下我需要一个row-count属性,但它不存在.我想我也可以在Javascript中做到这一点,但我正在寻找一个只有CSS的解决方案.

我尝试了一些东西:float:left每一个li都把列表放在一行.要将它分成两行,我需要不应用于float:leftN/2元素.我不知道该怎么做.

我也知道我可以通过将其分成多个ul,每个都有两个li,以及float:left它们来实现,但我想避免将HTML弄为完全呈现的东西.

有人有解决这个问题的方法吗？

编辑:我想我在解释我的要求时并不清楚.我希望将列表分类到列中,而不知道我将要拥有多少项,因此我将始终有两行.

所以例如有7个项目,我希望:

One    Two     Three   Four
Five   Six     Seven

并有3个项目:

One    Two
Three  

好吧,我有一个jQuery对话框,其中有一个表单,我在我的智慧结束时试图弄清楚...让我看看我是否可以用语言表达我想要做的事情..

我有3个文本框. #apInterest,#apPayment并#apPrincipal在正确的顺序.

我想要做的基本英语术语:

在#apInterestif .val小于0或大于99.99的密钥上触发错误..否则检查ul#mylist它是否有li,如果没有.hide

在#apPaymentif .val小于0的键盘上触发错误,否则检查列表是否li隐藏.

#apPrincipal 完全一样 #apPayment

我现在拥有什么

$('#apInterest').live("keyup", function(e) {
var parent = $('.inter').parents("ul:first");
if ($('#apInterest').val() < 0 || $('#apInterest').val() > 99.99) {
    $('.inter').remove();
    $('#mylist').append('<li class="inter">Interest Rate cannot be below 0 or above 99.99</li>');
    $('#popuperrors').show();
    $(this).addClass('error');
} else {
    $(this).removeClass('error');
    $('.inter').remove();
    alert(parent.children().text);
    if (parent.children().length == 0){
        $('#popuperrors').hide();
    }
}
});

虽然我也试过了

if ($("#mylist :not(:contains(li))") ){
$('#popuperrors').hide();
} …

是否可以仅在有序列表上设置或增加数字的大小？

我打算只使用CSS 将有序列表ol转换为类似wikihow的步骤.

以下是一个例子:http://jsfiddle.net/ejRzy/1/