两个不同大小的字想底部对齐 css前端开发

display: flex;

align-items: baseline;

html 复制代码
  <view class="main-price-view">
        <label class="price-unit">¥</label>
        <label class="price-title">100</label>
      </view>
css 复制代码
.main-price-view{
  font-family: PingFang SC, PingFang SC;
  font-weight: 600;
  font-size: 40rpx;
  color: #333333;
  text-align: left;
  display: flex;
  align-items: baseline;
  .price-unit{
    font-size: 20rpx;
    color: rgba(226, 30, 49, 1);
  // margin-bottom: 10rpx;
  }
  .price-title{
    font-weight: 600;
    font-size: 40rpx; 
    color: rgba(226, 30, 49, 1);
  }
        }
相关推荐
千寻girling几秒前
Koa.js 教程 | 一份不可多得的 Node.js 的 Web 框架 Koa.js 教程
前端·后端·面试
全栈前端老曹2 分钟前
【MongoDB】Node.js 集成 —— Mongoose ORM、Schema 设计、Model 操作
前端·javascript·数据库·mongodb·node.js·nosql·全栈
code_YuJun3 分钟前
pnpm-workspace.yaml
前端
天才熊猫君5 分钟前
“破案”笔记:iframe动态加载内容后,打印功能为何失灵?
前端
五月君_22 分钟前
炸裂!Claude Opus 4.6 与 GPT-5.3 同日发布:前端人的“自动驾驶“时刻到了?
前端·gpt
Mr Xu_27 分钟前
前端开发中CSS代码的优化与复用:从公共样式提取到CSS变量的最佳实践
前端·css
低代码布道师1 小时前
Next.js 16 全栈实战(一):从零打造“教培管家”系统——环境与脚手架搭建
开发语言·javascript·ecmascript
鹏北海-RemHusband1 小时前
从零到一:基于 micro-app 的企业级微前端模板完整实现指南
前端·微服务·架构
LYFlied1 小时前
AI大时代下前端跨端解决方案的现状与演进路径
前端·人工智能
光影少年1 小时前
AI 前端 / 高级前端
前端·人工智能·状态模式