-3

我需要做一个像这张图片这样的元素的html列表:

列表

我认为它是一个包含 li 或选项元素的外部 div。这是可能的?它是一种形式,因此我需要通过邮寄方式提交其价值。

谢谢。

4

4 回答 4

2

从我的评论继续...

<form>
  <select multiple>
    <option value="Element 1">Element 1</option>
    <option value="Element 2">Element 2</option>
    <option value="Element 3">Element 3</option>
  </select>
  <input type="submit" value="Submit">
</form>
于 2013-05-23T09:34:07.367 回答
1

我希望这个jsfiddle可以帮助你。

    <div class='wrapper'>
      <ul>
          <li>element 1</li> 
          <li>element 2</li>
          <li>element 3</li>
          <li>element 4</li>
          <li>element 5</li>
          <li>element 6</li>
    </ul>
</div>

和CSS

.wrapper{
    height : 100px;
    overflow : auto;
    width : 250px;
}
li{
    border : 1px black solid;
}
于 2013-05-23T09:27:33.537 回答
0

可以有太多不同的方法来做到这一点(div, liinside a div, table...)。我的建议,使用li元素到div. 我更喜欢这样,因为您可以更改div宽度和高度,使用溢出等,并且您的列表将更加个性化。

例子:

<div id="list-content">
    <ul>
        <li><span>Element 1</span></li>
        <li><span>Element 2</span></li>
        <li><span>Element 3</span></li>
        <li><span>Element 4</span></li>
        <li></li>
        <li></li>
        <li></li>
    </ul>
</div>

你的 CSS 必须是这样的:

div#list-content {
    width: 200px;
    height: 500px;
    overflow-y: scroll;
}

ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

li {
    border: 1px solid black;
    margin: 2px 0;
}
于 2013-05-23T09:29:48.670 回答
0

从我在这里看到的有很多方法可以做到这一点,有 divstyle="width:100%;float:left;"就是这样

于 2013-05-23T09:23:00.583 回答