css
CSS链接
链接的四种状态是：
a:link - 正常，未访问过的链接。
a:visited - 已访问过的链接。
a:hover - 当鼠标滑动到链接上时。
a:active - 链接被点击的那一刻。CSS列表
作用：1 设置不同的列表项标记 2 设置列表项标记为图像
修改列表项标记使用 list-style-type，使用图像作为标记可以利用 list-style-image 属性完成。
- 无序列表：
无序列表经常用来做导航栏菜单，通常都需要隐藏无序列表项的标记，那么就使用 list-style-type:none，表示无标记。 - list-style-type 属性的默认值为 disc 实心圆，即小黑点。除了无标记还可以修改标记，例如circle空心圆，square实心方块。
- 有序列表：
有序列表项标记默认使用数字样式显示，即 list-style-type:decimal。 - 图像作为列表项标记
要指定列表项标记的图像，可以使用 list-style-image 属性，只需要简单地设置一个 url() 值，就可以将图像作为标记类型。
列表属性简写：list-style：list-style-type，list-style-position，list-style-image;
CSS表格
表格边框： border
表格宽度和高度：width 和 height
表格对齐：text-align 和 vertical-align
表格内边距：tr,td的padding设置
<head>
<style>
#tab{
width:50%;
font-family:"微软雅黑";
/*设置是否将表格边框合并为单一线条的边框*/
border-collapse:collapse;
}
#tab th,#tab td{
/*表格边框*/
border:1px solid #7AC942;
/*表格内边距*/
padding:5px 10px;
}
#tab th{
color:white;
background-color:#9C3;
font-size:1.125em;
/*左对齐*/
text-align:left;
padding-top:4px;
padding-bottom:8px;
}
#tab .list td{
/*边颜色*/
color:#000;
/*背景颜色*/
background-color:#FFC;
}
caption{
margin-bottom:10px;
font-weight:bold;
}
</style>
</head>
<body>
<table id="tab">
<caption>食物类别</caption>
<thead>
<tr class="list">
<th>粗粮</th>
<th>蔬菜</th>
<th>水果</th>
</tr>
</thead>
<tbody>
<tr>
<td>大豆</td>
<td>黄瓜</td>
<td>香蕉</td>
</tr>
<tr class="list">
<td>高粱</td>
<td>菠菜</td>
<td>柠檬</td>
</tr>
<tr class="list">
<td>燕麦片</td>
<td>白菜</td>
<td>西瓜</td>
</tr>
</tbody>
</table>
</body>
【推荐】国内首个AI IDE，深度理解中文开发场景，立即下载体验Trae
【推荐】编程新体验，更懂你的AI，立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包，你的智能百科全书，全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell：AI 加持，快人一步
· 【自荐】一款简洁、开源的在线白板工具 Drawnix
· 没有Manus邀请码？试试免邀请码的MGX或者开源的OpenManus吧
· 无需6万激活码！GitHub神秘组织3小时极速复刻Manus，手把手教你使用OpenManus搭建本
· C#/.NET/.NET Core优秀项目和框架2025年2月简报
· DeepSeek在M芯片Mac上本地化部署