css实现姓名两端对齐-拓冰建站

1.1 效果

在这里插入图片描述

1.2 主要代码

text-align-last: justify;

1.3 html完整代码

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style scoped>.user_info {width: 50px;text-align-last: justify; }</style></head>
<body><div><div class="user_info">姓名</div></div><div><div class="user_info">身份证</div></div></body>
</html>

1.4 以 js 的方式插入 css 样式

我是在大屏幕中使用的，因为通过类名一直获取不到姓名这段html，所以就找到了最初始获取姓名这个数据的地方。
直接在姓名这个数据渲染前以模板字符串的方式插入样式。

person.patientName = `<div style="width:3em;text-align-last:justify;">${person.patientName}</div>`

css实现姓名两端对齐

1.1 效果

1.2 主要代码

1.3 html完整代码

1.4 以 js 的方式插入 css 样式

相关新闻

sort和sorted的区别、numpy和pandas、fastapi的原理、sso的单点登录、MySQL的日志、(缓存雪崩、缓存击穿、缓存穿透)

百度APP iOS端包体积50M优化实践(七)编译器优化

UDP数据报套接字

最新新闻

26届毕业生就业政策与人才引进——以厦门为例

WorkBuddy 实战教程：手把手配置自定义 MiMo 模型（踩坑全记录）

easy-explain：三行代码实现Grad-CAM可解释性分析

哑变量编码实战指南：One-Hot、Target Encoding与避坑决策树

从数据视角看云南旅行社选型：一份白皮书背后的技术逻辑

成都专业的暖通商家有哪些

日新闻

JMeter gRPC性能测试插件实战：从原理到CI/CD集成

iOS自动化测试：基于facebook-wda与weditor的稳定元素定位实战

MTKClient实战指南：深度解析联发科芯片调试与设备修复方案

周新闻

Figma中文界面插件终极指南：5分钟快速上手完整教程

Windows字体自定义终极方案：No!! MeiryoUI完全指南

WinBtrfs终极实战指南：3种配置方案解锁Windows Btrfs文件系统完整功能

月新闻

[C++]内存管理：串顺序存储的内存回收

移动端游戏功耗测试实战：电流、功率、亮度和场景对比

足球口袋教练 HarmonyOS 离线应用实战（03/20）：ArkUI 首页仪表盘搭建