HTML，一个表格单元格中有两种字体大小
问题描述 投票：0回答：2
<tr>
<th>ID</th><th>Station Name</th><th>Datum<br> <span style='font-size:3px'>(mAOD)</span> </th><th>Latest Level<br> <font size="1">(% of normal range)</font> </th><th>Recorded at</th><th></th>
</tr>
在上面的行中，span 和 font 标签对文本大小没有影响。
以下是完整页面供参考：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>River Levels</title>
<style>
body {
background-color: #000000;
COLOR: #ffff00;
font: normal 15px Verdana, Arial, sans-serif;
}
a:link,
a:visited {
color: #00ff00;
}
a:hover {
color: #009900;
text-decoration: underline;
}
h1 {
color: #ffff00;
}
p {
color: #ffff00;
margin-right: 15%;
margin-left: 15%;
border: 1px solid red;
padding: 30px;
}
table,
th,
td {
border: 1px solid red;
border-collapse: collapse;
text-align: center;
padding: 15px;
}
</style>
</head>
<body>
<center>
<img alt="Nene (76K)" src="RiverLevels2.png" /><br> <br />
<table>
<tr>
<th>ID</th>
<th>Station Name</th>
<th>Datum<br> <span style='font-size:3px'>(mAOD)</span> </th>
<th>Latest Level<br>
<font size="1">(% of normal range)</font>
</th>
<th>Recorded at</th>
<th></th>
</tr>
<tr>
<td>6286</td>
<td>Orton Sluice</td>
<td>2</td>
<td>15</td>
<td>01:45 Wed 31</td>
<td bgcolor="#7f00ff"> </td>
</tr>
<tr>
<td>6107</td>
<td>Wansford</td>
<td>8.03</td>
<td>11</td>
<td>01:45 Wed 31</td>
<td bgcolor="#593bfd"> </td>
</tr>
<tr>
<td>6111</td>
<td>Lilford</td>
<td>21.8</td>
<td>17</td>
<td>20:45 Tue 30</td>
<td bgcolor="#03b0ec"> </td>
</tr>
<tr>
<td>6104</td>
<td>Harrowden</td>
<td>45.4</td>
<td>18</td>
<td>06:00 Tue 30</td>
<td bgcolor="#92fda9"> </td>
</tr>
<tr>
<td>9396</td>
<td>Brigstock</td>
<td>52.05</td>
<td>9</td>
<td>01:45 Wed 31</td>
<td bgcolor="#bced8f"> </td>
</tr>
<tr>
<td>6108</td>
<td>South Bridge</td>
<td>56.0</td>
<td>0</td>
<td>01:45 Wed 31</td>
<td bgcolor="#d4dc7f"> </td>
</tr>
<tr>
<td>6103</td>
<td>Wootton Park</td>
<td>62.0</td>
<td>10</td>
<td>06:00 Tue 30</td>
<td bgcolor="#fab964"> </td>
</tr>
<tr>
<td>6120</td>
<td>Kislingbury</td>
<td>63.84</td>
<td>12</td>
<td>01:45 Wed 31</td>
<td bgcolor="#ffab5c"> </td>
</tr>
<tr>
<td>6101</td>
<td>Dodford</td>
<td>79.2</td>
<td>14</td>
<td>18:00 Tue 30</td>
<td bgcolor="#ff2512"> </td>
</tr>
<tr>
<td>6218</td>
<td>Brixworth</td>
<td>82.5</td>
<td>9</td>
<td>06:30 Tue 30</td>
<td bgcolor="#ff0301"> </td>
</tr>
</table><br />
</center>
<p>
Levels are scaled so that the normal range fits between the 2 green lines. Levels higher than 100% indicate that flooding is possible. Levels below zero may indicate a malfunctioning lock or sluice.
<br /> <br /> Line colours are derived from the site datum, blue is for sites close to sea level and red is higher up the river, lines with the same colour are from sites at the same level.
<br /> <br /> Data from here: <a href="https://flood-warning-information.service.gov.uk/river-and-sea-levels">
https://flood-warning-information.service.gov.uk/river-and-sea-levels</a>. Data is updated by the Environment Agency daily, more often in times of flood.
<br /> <br /> Contains public sector information licensed under the <a href="http://www.nationalarchives.gov.uk/doc/open-government-licence/version/3/">Open Government Licence v3.0.</a>
</p>
<center>
<table>
<tr>
<th>Station Name</th>
<th>Rainfall<br>
<font size="-3"> (24 hours)</font>
</th>
<th>Recorded</th>
</tr>
<tr>
<tr>
<td>Dog In A Doublet </td>
<td>0.0mm</td>
<td>4:45am on 28 January</td>
</tr>
<tr>
<td>Chesterton </td>
<td>0.0mm</td>
<td>5:15am on 28 January</td>
</tr>
<tr>
<td>Metoff Wittering </td>
<td>0.0mm</td>
<td>5:00am on 28 January</td>
</tr>
<tr>
<td>Kings Cliffe </td>
<td>0.0mm</td>
<td>6:30am on 27 January</td>
</tr>
<tr>
<td>Oundle </td>
<td>0.0mm</td>
<td>4:30am on 28 January</td>
</tr>
<tr>
<td>Brigstock </td>
<td>0.2mm</td>
<td>4:30am on 28 January</td>
</tr>
<tr>
<td>Wellingborough </td>
<td>0.8mm</td>
<td>4:30am on 28 January</td>
</tr>
<tr>
<td>Yardley Hastings </td>
<td>0.0mm</td>
<td>6:30am on 27 January</td>
</tr>
<tr>
<td>Quinton </td>
<td>0.0mm</td>
<td>5:15am on 28 January</td>
</tr>
<tr>
<td>Pitsford </td>
<td>0.0mm</td>
<td>5:45am on 28 January</td>
</tr>
<tr>
<td>Dodford </td>
<td>0.0mm</td>
<td>6:30am on 27 January</td>
</tr>
</table>
</center>
<p>Rainfall data updated at 06:10GMT, Sun 28 January <br>
<a href="https://environment.data.gov.uk/catchment-planning/ManagementCatchment/3059"> <br> Nene catchment map</a>
</p>
</body>
</html>我希望标记的文本更小。
我也尝试过“小”并定义一个div。
2个回答
0
投票
投票
它似乎工作正常，假设您的问题是您希望表标题行“最新级别（正常范围的％）”中的文本具有不同的大小，其中文本“最新级别”比中的文本大括号。
0
投票
投票
您的代码对我有用，两个标签都有小字体，但我添加了两个类并为您创建了一个片段。
.small.smallerbody {
background-color: #000000;
COLOR: #ffff00;
font: normal 15px Verdana, Arial, sans-serif;
}
a:link,a:visited {
color: #00ff00;
}
a:hover {
color: #009900;
text-decoration: underline;
}
h1 {color: #ffff00;}
p {color: #ffff00;
margin-right: 15%;
margin-left: 15%;
border: 1px solid red;
padding: 30px;
}
table, th, td {
border: 1px solid red;
border-collapse: collapse;
text-align: center;
padding: 15px;
}
.small{
font-size:8px;
}
.smaller{
font-size:4px
}<table>
<tr>
<th>ID</th>
<th>Station Name</th>
<th>Datum<br> <span class="smaller">(mAOD)</span> </th>
<th>Latest Level<br> <font class="small">(% of normal range)</font> </th>
<th>Recorded at</th>
<th></th>
</tr>
<tr>
<td>6286</td>
<td>Orton Sluice</td>
<td>2</td>
<td>15</td>
<td>01:45 Wed 31</td>
<td bgcolor="#7f00ff"> </td></tr>
</table> 最新问题
- 如何让 Jackson 使用 Kotlin 默认参数来处理缺失值？
- Oracle Data Pump的正确使用方法——expdp、impdp
- 如何用Java将JSON写入文件
- NSViewRepresentable.updateNSView 不会被调用，除非修改后的绑定变量在内部使用
- 在 Azure 管道上安装 npm 期间 JavaScript 堆内存不足
- R dbconnect 错误
- 从 R 读取从 SAP HANA 中的过程创建的视图
- Expo 构建问题 - 不支持的 MIME 类型：image/webp
- brightway25 并导入 ecoinvent v3.10 的本地副本
- 我收到 io.cucumber.core.exception.CucumberException: 无法实例化类 stepDefinitions.sessionDetailsStepDef
- Ubuntu 18.04 RJDBC：与 Oracle 的 JDBC 连接挂起无响应
- 创建 Azure OpenAI 验证失败
- 在 R（并使用 ROracle）中，如何成功从数据库中提取数据？
- 如果通过 Duo 应用程序需要 MFA（多重身份验证），如何通过 R 连接到 Snowflake 数据库？
- 如何在 libs.versions.toml 中将具有确切版本的插件添加到 New Android Studio Iguana 或更高版本
- SwiftData 应用程序仅在通过 TestFlight 部署时才会崩溃
- 强制文件在reactNative中重新渲染
- Bootstrap-table：预填充列选择按钮：少数已选择，大多数未选择
- ubuntu 20.04、php8.0 中的 PhpMyAdmin 出现“弃用通知”错误
- Numpy 索引参数与整数数组排序，同时保留排序顺序
© www.soinside.com 2019 - 2024. All rights reserved.