我想使用CSS border属性1px在span元素之间制作一个精细的网格,就像这样.
|
1 | 2
-----|-----
3 | 4
|
这就是我现在拥有的.它显然不太明显.
<html>
<head>
<style>
div {
width: 204px;
}
span {
display: inline-block;
height: 100px;
width: 100px;
border: 1px solid #ccc;
border-left-width: 0;
border-top-width: 0;
}
</style>
</head>
<body>
<div><span>1</span><span>2</span><span>3</span><span>4</span></div>
</body>
</html>
当div设置为306px和元素重排时,解决方案应该动态调整.
| |
1 | 2 | 3
-----|-----|-----
4 |
|
最好是CSS,或纯Javascript.像IE7这样的旧浏览器可以忽略.