html table样式的设计 表格边框修饰

html 复制代码
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>今日小说排行榜</title>
<style>
table {
  border-collapse: collapse;
  border: 4px double red; /* 表格外边是双线 */
  width:100%;
}

th,td {
  border: 1px dashed green; /* 单元格边框为虚线 */
  border-right:2px dashed green;
  padding: 10px; /* 设置单元格内边距 */
}
caption{ 
font-size:24px;
font-weight: bold;
}
</style>
</head>

<body>
<table width="200" border="1">
<caption>今日小说排行榜</caption>
  <tr>
    <th>排名</th>
    <th>关键词</th>
    <th>趋势</th>
    <th>今日搜索</th>
    <th>最近7日</th>
    <th>相关链接</th>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
</table>
</body>
</html>
相关推荐
我就是马云飞7 分钟前
我废了!大厂10年的我面了20家公司,面试官让我回去等通知!
android·前端·程序员
yizhiyang25 分钟前
ECharts实战:滑动缩放+选中背景高亮,打造高颜值统计图表
前端
猫山月29 分钟前
Flutter路由演进路线(2026)
前端·flutter
We་ct30 分钟前
LeetCode 322. 零钱兑换:动态规划入门实战
前端·算法·leetcode·typescript·动态规划
袋鱼不重33 分钟前
Hermes Agent 直连飞书机器人
前端·后端·ai编程
不务正业的前端学徒34 分钟前
Threejs,地图标签绘制,碰撞检测逻辑
前端
qq_120840937143 分钟前
Three.js 工程向:GPU Overdraw 诊断与前端渲染优化
前端
纯爱掌门人1 小时前
聊聊 HarmonyOS 上的应用内通知授权弹窗
前端·harmonyos·arkts
Cdlblbq1 小时前
搜索会员中心 创作中心Vue2项目一键打包成桌面应用
前端·javascript·vue.js·electron
eason_fan1 小时前
前端避坑指南:一文吃透 npm 幽灵依赖(Phantom Dependency)
前端·前端工程化