帮我写一个手机端的列表,用html5
时间: 2023-08-28 22:35:37 浏览: 86
手机版列表html
4星 · 用户满意度95%
好的,以下是一个简单的手机端列表的HTML5代码示例,你可以根据你的需求进行修改和样式美化:
```html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>手机端列表</title>
<style type="text/css">
body{
font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
font-size: 14px;
line-height: 1.42857143;
color: #333;
background-color: #fff;
}
.container{
max-width: 640px;
margin: 0 auto;
padding: 20px;
}
.list{
list-style: none;
padding: 0;
margin: 0;
}
.list li{
padding: 10px;
border-bottom: 1px solid #ccc;
cursor: pointer;
}
.list li:hover{
background-color: #f5f5f5;
}
.list li:last-child{
border-bottom: none;
}
</style>
</head>
<body>
<div class="container">
<ul class="list">
<li>列表项1</li>
<li>列表项2</li>
<li>列表项3</li>
<li>列表项4</li>
<li>列表项5</li>
</ul>
</div>
</body>
</html>
```
这个列表使用了无序列表(ul)和列表项(li)标签,通过CSS样式设置了列表的样式和鼠标悬停效果。你可以根据需要进行修改。
阅读全文