[title] 选择器本身不加边框，必须配合 border 声明（含宽度、样式、颜色三要素）才可见；常见错误是遗漏 border-style；推荐简写 border: 1px solid #666；空 title 也匹配；影响布局时可用 box-shadow 替代。

[title] 选择器本身不会自动加边框，它只是匹配所有带 title 属性的元素。要真正加边框，必须配合 border 相关声明 —— 否则元素看起来和没加一样。

为什么 [title] 选中了却看不到边框？

常见错误是只写了 [title] { }，但漏写 border 或其子属性。CSS 中 border-style 默认为 none，哪怕写了 border-width: 1px 和 border-color: red，只要没显式设 border-style: solid（或其它非 none 值），边框依然不显示。

[title] 加边框的最小可行写法

必须同时指定三要素：宽度、样式、颜色（或用简写）。推荐用 border 简写，避免遗漏：

[title] {
  border: 1px solid #666;
}

• 这个规则会作用于所有含 title 属性的元素，比如 <div title="提示">、<code><img title="图标">、<a title="跳转"></a>
• 若只想加某一边（如仅上边框），改用 border-top: 1px solid #666
• 注意：某些内联元素（如 <span></span>）默认不支持 border 的盒模型表现，必要时加 display: inline-block

和 title 属性值内容无关的匹配逻辑

[title] 是存在性匹配，不是内容匹配。以下全部命中：


CSS婚礼策划服务机构宣传网站模板
CSS婚礼策划服务机构宣传网站模板是一款适合提供婚礼策划和婚庆服务机构宣传网站模板下载。提示：本模板调用到谷歌字体库，可能会出现页面打开比较缓慢。
下载
• <button title=""></button>（空字符串也算）
• <p title=" "></p>（只含空格）
• <input title="submit">

如果只想匹配非空且含特定文字的 title，得用属性值选择器，例如：[title*="error"] 匹配含 “error” 的，[title^="警告"] 匹配以 “警告” 开头的。

容易踩的坑：边框影响布局 & 伪元素干扰

直接给 [title] 加 border 会改变元素尺寸（触发盒模型重排），尤其对内联元素或已有 padding/margin 的容器很敏感：

• 想不占空间？改用 box-shadow: 0 0 0 1px #666 替代 border
• 如果页面已用 ::before 或 ::after 在 [title] 元素上画标题（比如把 title 提到边框上方），再加 border 可能导致定位错乱，需检查 position 和 z-index
• 部分 UI 框架（如 Bootstrap）会对 img、button 等元素重置 border，此时需提高选择器优先级，比如加 !important 或用 img[title]
真正起作用的从来不是选择器本身，而是你写在花括号里的那几行声明；[title] 只负责“找人”，边框要不要画、怎么画、画在哪，全看后续规则是否完整且没被覆盖。