只有当价格附带必须注意的时效、自动扣款或不可退款等风险提示时,才用强调;单纯标价无此必要,应优先用css类突出或强调附属信息。

不要用 <strong></strong> 包裹价格本身,除非该金额带有不可忽略的操作约束或风险提示。
什么时候该用 <strong></strong> 标注价格
只有当价格信息附带「必须被用户注意到,否则会导致误操作或损失」的语义时,才值得动用 <strong></strong>。比如:
- 限时优惠倒计时中的
<strong>最后24小时</strong> ¥99—— 时间紧迫性 + 金额变动双重关键 - 订阅页底部提示:
确认后将按 <strong>¥198/年</strong> 自动续费—— 金额+自动扣款动作构成风险点 - 表单提交前警告:
您即将支付 <strong>¥5,200</strong>,此订单不可退款—— 金额+不可逆后果
为什么直接 <strong>¥99</strong> 是错的
单纯标价本身不自带语义重要性。搜索引擎不会因你加了 <strong></strong> 就认为这个价格更权威;屏幕阅读器会加重朗读“¥99”,但用户只听到一串数字,没上下文,反而困惑。常见误用包括:
-
<p>原价<strong>¥299</strong>,现价¥99</p>—— “原价”不是操作风险点,只是参考值 - 商品卡片标题里写
<h3> <strong>iPhone 15 Pro</strong> <strong>¥7,999</strong> </h3>—— 品牌和价格都无紧急性,纯视觉需求 - 整行价格都套进去:
<p><strong>¥99(含税)</strong></p><div class="aritcle_card flexRow artxards"> <div class="artcardd flexRow"> <a class="aritcle_card_img" rel="nofollow" href="/xiazai/skill9972" title="Wechat Article Html"><img src="https://img.php.cn/upload/skill/001/246/273/6adaf20e695c2374.jpg" alt="Wechat Article Html" onerror="this.onerror='';this.src='/static/lhimages/moren/morentu.png'" ></a> <div class="aritcle_card_info flexColumn"> <a rel="nofollow" href="/xiazai/skill9972" title="Wechat Article Html" class="overflowclass">Wechat Article Html</a> <p class="overflowclass">将 Markdown 文章转换为微信公众号兼容的纯 HTML 格式。当用户要求"转成微信格式"、"生成公众号文章 HTML"、"排版到微信草稿箱"、"微信粘贴格式"时触发。输出带内联样式的纯 HTML,微信编辑器可直接渲染,无需额外适配。支持标题、段落、列表、粗体、行内代码、表格、引用块、代码块、配图的完整转换。</p> </div> <a rel="nofollow" href="/xiazai/skill9972" title="Wechat Article Html" class="aritcle_card_btn flexRow flexcenter"><b></b><span>下载</span> </a> </div> </div>—— “含税”才是需注意的信息,金额本身不是
更合适的替代方案
多数价格展示场景,语义重点不在“金额数值”,而在「状态」「条件」或「动作」上。优先考虑:
- 用
<span></span>+ CSS 类控制视觉突出,例如<span class="price-highlight">¥99</span> - 把
<strong></strong>留给真正有分量的附属信息:如<span>¥99</span> <strong>今日特价</strong>或<strong>免运费</strong> 起 - 需要强调价格变动逻辑时,包裹整个短语:
<strong>立减¥200</strong>比单独强调¥200更合理
嵌套与混用的真实边界
别为了“又粗又斜”硬套 <em></em> 或再包一层 <strong></strong>。例如:
- ❌
<strong>¥<em>99</em></strong>—— 无分层语义,辅助技术无法理解为何既重要又语气强调 - ✅
<p>仅限今日:<strong>¥99</strong>(原价¥299)</p>——<strong></strong>承载时效约束,金额是其具象化表达,语义连贯
最常被忽略的一点:可访问性不是靠标签数量堆出来的,而是靠每次使用 <strong></strong> 都能回答清楚——“如果用户跳过这串文字,会不会点错、买错、漏看关键限制?”










