CSS设置Tahoma字体无效?考试样式修改遇系统判定问题
考试中CSS字体设置验证失败的排查与解决
你遇到的问题很典型——代码逻辑上完全正确,但自动评分系统却判定未设置Tahoma字体,核心原因大概率是评分系统的验证逻辑过于死板,以下是具体分析和解决办法:
可能的验证逻辑问题
很多考试用的自动评分工具不会识别CSS群组选择器(h1, h2, p)的批量设置,只会逐个检查每个目标选择器的独立规则块中是否包含font-family属性。你的代码是通过群组选择器统一设置字体,但系统可能期望你直接在原有h1、h2、p的规则块内添加字体声明。
解决办法
将font-family直接写入每个目标元素的原有规则中,替代群组选择器的写法:
* { box-sizing: border-box; } body { background-color: #FFF; margin: 0px; padding: 50px 60px; } h1 { color: #007E49; font-size: 50px; font-weight: 400; margin: 0; text-align: center; font-family: Tahoma, sans-serif; /* 直接添加到这里 */ } h2 { font-size: 16px; font-weight: 100; letter-spacing: 2px; margin: 0; text-align: center; text-transform: uppercase; font-family: Tahoma, sans-serif; /* 直接添加到这里 */ } p { font-size: 16px; font-weight: 100; margin: 0; text-align: center; font-family: Tahoma, sans-serif; /* 直接添加到这里 */ } /* 以下原有代码保持不变 */ #gameboard { position: relative; text-align: center; top: 30px; } .card { border: 2px solid #9DD1F1; display: inline-block; height: 200px; margin-top: 4px; padding: 30px auto; text-align: center; width: 215px; } .card:hover { background-color: #004E89; border-color: #004E89; } .card img { padding-top: 40px; }
其他排查点
- 拼写检查:确认
Tahoma拼写无误(CSS对字体名称大小写不敏感,但部分严格系统可能要求完全匹配); - 样式覆盖:你后续的
h1/h2/p规则没有重写font-family,不存在样式覆盖问题; - 盒模型设置:
* { box-sizing: border-box; }的写法完全正确,这部分无需调整。
内容的提问来源于stack exchange,提问作者fredsarm
相关产品推荐
相关产品推荐

