本文介绍如何使用 selenium 的 getcssvalue() 方法精准获取并验证 webtable 中某列（如 name 列）内嵌套元素（如姓名与性别）各自独立的字体大小，避免因父容器样式干扰导致误判。
在实际自动化测试中，仅定位到
并调用 getCssValue("font-size") 获取的是该容器自身的字体大小（即父级 div 的 font-size），而无法反映其内部不同子元素（如 "Sam Michaels" 和 Male）的真实样式。因此，必须精准定位到目标文本所在的 DOM 节点，再分别校验。
以你的 DOM 结构为例，Name 列每行包含两个语义层级：
- 主名称（如 "Sam Michaels"）：通常继承自父 div 或由顶层 渲染；
- 性别（如 "Male"）：明确包裹在带内联样式的 中。
✅ 正确做法是分层定位并逐个验证：
// 定位 Name 列的所有行单元格（假设为多行） ListnameCells = driver.findElements(By.xpath("//div[@col-id='Name']")); for (int i = 0; i < nameCells.size(); i++) { WebElement cell = nameCells.get(i); // ✅ 获取主名称文本所在 span（注意：文本节点本身无样式，需找其最近的有样式的父 span） // 根据结构，名称文本位于第一个 内，但无内联 font-size → 继承自父 div 或全局样式 String nameFontSize = cell.getCssValue("font-size"); // 获取容器默认字号（如用于"Sam Michaels"） // ✅ 精准定位性别 span（带明确 font-size 样式） WebElement genderSpan = cell.findElement(By.xpath(".//span[@style and contains(@style, 'font-size')]")); String genderFontSize = genderSpan.getCssValue("font-size"); // 返回 "1.2rem"（Selenium 自动解析为 px，如 "19.2px"） System.out.printf("Row %d — Name font: %s, Gender font: %s%n", i + 1, nameFontSize, genderFontSize); // ✅ 断言示例（转换为数值便于比较） double nameSizePx = parseFontSizeToPx(nameFontSize); double genderSizePx = parseFontSizeToPx(genderFontSize); assertThat(nameSizePx).isGreaterThan(genderSizePx); // 验证“姓名”比“性别”字号大 }
? 辅助方法：将 CSS 字体值统一转为像素（px）进行断言
中网互连企业网站管理系统201106
下载
中网互连企业网站管理系统是专门针对企业而开发的一套功能强大的网站管理系统，使用成熟的ASP技术开发的动态网站系统。简单易用、功能强大，能让懂上网的人就能自助管理管理网站。三年的开发和几千用户使用验证，是一套可靠实用，稳定安全的企业网站，适合中小企业公司建站使用。 中网互连企业网站管理系统功能模块有：单页（如企业简介，联系内容等单页图文）、文章（新闻）列表、产品（图片、订单、规格说明等）、图片、下
public static double parseFontSizeToPx(String cssValue) {
if (cssValue == null || cssValue.isEmpty()) return 0;
if (cssValue.endsWith("px")) return Double.parseDouble(cssValue.replace("px", "").trim());
if (cssValue.endsWith("rem")) {
// 假设根元素 font-size = 16px（标准浏览器默认），1rem = 16px
double remValue = Double.parseDouble(cssValue.replace("rem", "").trim());
return remValue * 16;
}
if (cssValue.endsWith("%")) {
// 简化处理：按父元素 16px 基准换算（实际需结合 computed style）
double pct = Double.parseDouble(cssValue.replace("%", "").trim());
return 16 * pct / 100;
}
return Double.parseDouble(cssValue); // 如 "18px" 已处理，其他情况可扩展
}⚠️ 关键注意事项：
- getCssValue("font-size") 返回的是计算后样式（computed value），单位统一为 px（即使 HTML 中写的是 rem、em 或 %），但需注意浏览器渲染差异；
- 不要依赖 getText() 或文本节点（Text node）调用 getCssValue() —— 文本节点无样式属性，必须定位到承载样式的 HTML 元素；
- 若列中存在动态渲染或虚拟滚动，需确保目标元素已加载并可见（可加 WebDriverWait 显式等待）；
- 对于复杂字体继承链，建议结合浏览器开发者工具的 “Computed” 面板验证预期值，再编写断言。
通过以上方式，你不仅能准确识别 Name 列中不同语义内容的字体差异，还能构建稳定、可维护的视觉一致性校验逻辑，真正实现 UI 层面的精细化验证。
