简体   繁体   English

<ul><li>做列表行

[英]<ul> <li> do make to rows of list

I Have 15 names, and what I want to do is to divde the names in three rows (5names on each row), at the moment Iam using <ul> and <li> tags 我有15个名字,我想做的是将名称分成三行(每行5个名字),目前我使用<ul><li>标签

is there some possible way to have three rows 5 names on each row? 有没有办法在每一行上有三行5个名字? using still the li and ul tags? 使用liul标签?

查找的方法列表做你想要的这里

This worked for me: 这对我有用:
CSS: CSS:

.test {
    padding:0;
    margin:0;
    list-style-type:none;
    width:500px;
}
.test li {
    width:100px;
    float:left;
}

HTML: HTML:

<ul class="test">
    <li>1</li>
    <li>2</li>
    <li>3</li>
    <li>4</li>
    <li>5</li>
    <li>6</li>
    <li>7</li>
    <li>8</li>
    <li>9</li>
    <li>10</li>
    <li>11</li>
    <li>12</li>
    <li>13</li>
    <li>14</li>
    <li>15</li>
</ul>

确保float: left并将li width to 20%设置为总宽度的li width to 20% (可能略小)。

You could use a nested list. 您可以使用嵌套列表。 CSS allows lists to be made inline by using display: inline and list-style-type: none . CSS允许使用display: inlinelist-style-type: none display: inline list-style-type: none If you give every li element to be listed horizontally these properties you can list them side by side. 如果您将每个li元素水平列出这些属性,您可以并排列出它们。

Hope this helps 希望这可以帮助

James 詹姆士

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM