PHP小码农

Appearance

var 变量 ​

<var> 标签用于表示数学表达式或编程上下文中的变量。浏览器默认以斜体渲染 <var> 中的内容，表明这是一个可变的量或需要由用户提供值的占位符。

前置知识

阅读本节前，建议先了解：code 与 kbd 与 samp

基础概念 ​

<var>（variable）表示文本是一个变量——在数学中是方程式中的变量，在编程中是变量名，在日常文本中是需要替换的占位符。它的语义是"这是一个可变的值"。

语法 ​

html
<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <meta charset="UTF-8">
  <title>var 示例</title>
</head>
<body>
  <!-- 数学变量 -->
  <p>圆的面积公式：S = &pi; <var>r</var><sup>2</sup></p>

  <!-- 编程变量 -->
  <p>将 <var>username</var> 替换为实际的用户名。</p>
</body>
</html>

详细说明 ​

var 的默认样式 ​

属性默认值（Chrome）
displayinline
font-styleitalic

数学表达式中的 var ​

html
<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <meta charset="UTF-8">
  <title>数学公式中的 var</title>
</head>
<body>
  <h1>数学公式</h1>

  <p>一元二次方程：<var>a</var><var>x</var><sup>2</sup> + <var>b</var><var>x</var> + <var>c</var> = 0</p>

  <p>求根公式：x = (-<var>b</var> &pm; &radic;(<var>b</var><sup>2</sup> - 4<var>a</var><var>c</var>)) / 2<var>a</var></p>

  <p>等差数列通项公式：<var>a</var><sub>n</sub> = <var>a</var><sub>1</sub> + (<var>n</var> - 1)<var>d</var></p>
</body>
</html>

编程文档中的 var ​

html
<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <meta charset="UTF-8">
  <title>编程文档中的 var</title>
</head>
<body>
  <h1>函数参数说明</h1>

  <p>函数 <code>greeter(<var>name</var>, <var>greeting</var>)</code> 接受两个参数：</p>

  <ul>
    <li><var>name</var>：要问候的人的名字（字符串类型）</li>
    <li><var>greeting</var>：问候语（可选，默认为"你好"）</li>
  </ul>

  <p>调用示例：<code>greeter("张三", "早上好")</code></p>
</body>
</html>

占位符场景 ​

html
<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <meta charset="UTF-8">
  <title>占位符</title>
</head>
<body>
  <h1>使用说明</h1>

  <p>请将以下配置中的 <var>YOUR_API_KEY</var> 替换为你实际的 API 密钥。</p>

  <p>连接字符串格式：<code>mongodb://<var>host</var>:<var>port</var>/<var>database</var></code></p>
</body>
</html>

var 与 code 的区别 ​

标签语义典型场景
<var>表示变量或占位符数学公式、函数参数、配置模板
<code>表示代码片段代码名称、函数名、命令
html
<!-- var：表示变量/占位符 -->
<p>将 <var>port</var> 设置为 <code>8080</code>。</p>

<!-- code：表示具体的代码内容 -->
<p>使用 <code>parseInt()</code> 函数转换类型。</p>

实战示例 ​

API 文档参数说明 ​

html
<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <meta charset="UTF-8">
  <title>API 文档</title>
  <style>
    body { max-width: 680px; margin: 0 auto; padding: 2rem 1rem; font-family: sans-serif; }
    var { font-style: italic; color: #d32f2f; }
    code { background: #f5f5f5; padding: 0.1em 0.3em; border-radius: 2px; font-family: monospace; }
  </style>
</head>
<body>
  <h1>GET /api/users/:id</h1>

  <h2>路径参数</h2>
  <ul>
    <li><var>id</var>（必填）— 用户的唯一标识符</li>
  </ul>

  <h2>查询参数</h2>
  <ul>
    <li><code>fields</code> — 返回的字段列表，多个字段用逗号分隔</li>
    <li><code>page</code> — 页码，默认为 1</li>
  </ul>

  <h2>响应示例</h2>
  <pre><code>{
  "id": "<var>user_id</var>",
  "name": "<var>user_name</var>",
  "email": "<var>user_email</var>"
}</code></pre>
</body>
</html>

注意事项 ​

  • <var> 不表示"具体的变量值"，而是"变量这个概念"
  • 不要用 <var> 标记固定的常量值
  • 如果变量名较长或需要特殊样式，可结合 CSS 使用

最佳实践 ​

  1. 用于数学公式中的变量：方程式中的未知数
  2. 用于函数参数文档：API 文档中的参数占位
  3. 用于配置模板：需要用户替换的值
  4. 配合 code 使用：在代码文档中标注变量部分

下一节

继续学习：abbr 缩写

参考链接 ​