我想实现以下结构:
[gfhtfg..., kgjrfg..., asd, mrhgf, ]
^-------^ ^-------^ ^-------^ ^-------^
X X X X
(X = a fixed length)
我<div>有一个固定长度,并在其中有一个水平,逗号分隔ul的链接列表().
该<li>元件应具有一个固定的宽度,并且因此,如果链接超过固定长度省略号将被显示(使用text-overflow性).
我知道两种方法可以使列表水平.一个是使用display: inline,另一个是使用该float属性.
float在<a>元素上设置,旨在限制其宽度,将其与逗号分隔开.没有浏览器兼容性问题,我只需要支持WebKit.
我包含了我尝试使用的代码:
<!DOCTYPE html>
<html lang="en">
<head>
<title>a title</title>
<style>
body { font-family: arial; font-size: 10pt; }
div {
height: 30px;
width: 300px;
background: #eee;
border: 1px solid #ccc;
text-align: center;
}
ul { margin: 0px; padding: 0px; } …