在 HTML 表格中指定字体和大小

Posted

技术标签:

【中文标题】在 HTML 表格中指定字体和大小【英文标题】:Specifying Font and Size in HTML table 【发布时间】:2017-05-13 02:02:58 【问题描述】:

我正在尝试为表格中的文本指定字体和大小。它似乎尊重 FACE= 但忽略了 SIZE=。例如,我有如下所示的 html。它可以正确显示 Courier New 中的文本,但两个表格都以相同的字体大小显示。任何线索我做错了什么?

<font face="Courier New" size="12"><table ><tr><td><b>Client</b></td><td><b>InstanceName</b></td><td><b>dbname</b></td><td><b>Filename</b></td><td><b>KeyName</b></td><td><b>Rotation</b></td><td><b>Path</b></td></tr>
<tr><td>NEWDEV6</td><td>EXPRESS2012</td><td>master</td><td>master.mdf</td><td>test_key_16</td><td>0</td><td>d:\Program&nbsp;Files\Microsoft&nbsp;SQL&nbsp;Server\MSSQL11.EXPRESS2012\MSSQL\DATA\master.mdf</td></tr>
</table></font>
<font face="Courier New" size="24"><table ><tr><td><b>Client</b></td><td><b>InstanceName</b></td><td><b>dbname</b></td><td><b>Filename</b></td><td><b>KeyName</b></td><td><b>Rotation</b></td><td><b>Path</b></td></tr>
<tr><td>NEWDEV6</td><td>EXPRESS2012</td><td>master</td><td>master.mdf</td><td>test_key_16</td><td>0</td><td>d:\Program&nbsp;Files\Microsoft&nbsp;SQL&nbsp;Server\MSSQL11.EXPRESS2012\MSSQL\DATA\master.mdf</td></tr>
</table></font>

【问题讨论】:

【参考方案1】:

首先,尝试省略 12 和 24 中的引号。值得一试。

其次,最好在 CSS 中执行此操作。另见http://www.w3schools.com/css/css_font.asp。这是表格标签的内联样式:

<table style='font-family:"Courier New", Courier, monospace; font-size:80%' ...>...</table>

更好的是,使用外部样式表 HTML 文档顶部附近的样式标记。另见http://www.w3schools.com/css/css_howto.asp。

【讨论】:

仅供参考,引号是强制性的。但是你是对的,CSS,内联或其他方式,是要走的路,因为不再支持 FONT 标签。 看起来切换到内联 CSS 是可行的方法。 内联可以快速处理,但从长远来看,指定class 属性会更好。 仅供参考 在表格上使用内联样式对嵌入的输入元素没有影响。内联样式的帖子对我帮助很大,只是想对 INPUT 元素做一个仅供参考。我敢肯定还有其他元素不会从表中继承样式。我同意,支持 css 文件是最好的解决方案。【参考方案2】:

用 html 和 body 标签括起来您的代码。 Size 属性与 font-size 不对应,看起来它的域没有超过值 7。此外,HTML5 不支持字体标签。 根据您的情况考虑此代码

<!DOCTYPE html>
<html>
<body>

<font size="2" face="Courier New" >
<table >
    <tr>
        <td><b>Client</b></td>
        <td><b>InstanceName</b></td>
        <td><b>dbname</b></td>
        <td><b>Filename</b></td>
        <td><b>KeyName</b></td>
        <td><b>Rotation</b></td>
        <td><b>Path</b></td>
    </tr>
    <tr>
        <td>NEWDEV6</td>
        <td>EXPRESS2012</td>
        <td>master</td><td>master.mdf</td>
        <td>test_key_16</td><td>0</td>
        <td>d:\Program&nbsp;Files\Microsoft&nbsp;SQL&nbsp;Server\MSSQL11.EXPRESS2012\MSSQL\DATA\master.mdf</td>
    </tr>
</table>
</font>
<font size="5" face="Courier New" >
<table >
    <tr>
        <td><b>Client</b></td>
        <td><b>InstanceName</b></td>
        <td><b>dbname</b></td>
        <td><b>Filename</b></td>
        <td><b>KeyName</b></td>
        <td><b>Rotation</b></td>
        <td><b>Path</b></td></tr>
    <tr>
        <td>NEWDEV6</td>
        <td>EXPRESS2012</td>
        <td>master</td>
        <td>master.mdf</td>
        <td>test_key_16</td>
        <td>0</td>
        <td>d:\Program&nbsp;Files\Microsoft&nbsp;SQL&nbsp;Server\MSSQL11.EXPRESS2012\MSSQL\DATA\master.mdf</td></tr>
</table></font>
</body>
</html>

【讨论】:

谢谢。这是缺少的 。一旦我添加它就可以了。【参考方案3】:

font tag 已被弃用一段时间了。

话虽如此,您的两个表格都以相同的字体大小显示的原因是“大小”属性只接受 1 - 7 范围内的值。最小的大小是 1。最大的大小是 7。默认值size 为 3。任何大于 7 的值都将显示与使用 7 相同的值,因为 7 是允许的最大值。

正如@Alex H 所说,您应该为此使用 CSS。

【讨论】:

【参考方案4】:

这对我有用,也适用于引导表

<style>
    .table td, .table th 
        font-size: 10px;
    
</style>

【讨论】:

以上是关于在 HTML 表格中指定字体和大小的主要内容,如果未能解决你的问题,请参考以下文章

Chrome 正在覆盖我的 CSS 中指定的字体大小

java导出excel字体大小不一样怎么处理

使用js方法将table表格中指定列指定行中相同内容的单元格进行合并操作。

html网页制作里设置表格字体和大小的语句有吗?是啥?

在使用 VBA 的 MS Access 链接的 Excel 电子表格中指定“开放式”范围

latex 设置表格的字体大小和行高