文本實現斑馬線效果
<style>
p {
font-size: 17px;
line-height: 25px;
background-color: antiquewhite;
background-image: linear-gradient(#99999 50%, transparent 0);
background-size: auto 50px;
background-origin: content-box;
}
</style>
<body>
<p>咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕</p>
</body>
表格實現斑馬線效果
<style>
tr{
background: #ffffff;
width: 1.25rem;
height: 1.875rem;
}
tr:nth-child(2n) {
background: #E9E9E9;
}
</style>
<body>
<table>
<tr>
<td>1</td><td>2</td><td>3</td><td>4</td>
</tr>
<tr>
<td>1</td><td>2</td><td>3</td><td>4</td>
</tr>
<tr>
<td>1</td><td>2</td><td>3</td><td>4</td>
</tr>
</table>
</body>