使用 CSS 样式化 HTML 标题属性答案

【问题标题】：Styling HTML Title attribute using CSS使用 CSS 样式化 HTML 标题属性
【发布时间】：2013-07-04 14:07:55
【问题描述】：

我正在尝试使用 CSS 设置 <input type="text"> 的标题属性。所以这就是我所做的：

input[type="text"][title] {
    font-style: italic;
    color: gray;
}

它工作正常，但是当我在字段中输入数据时，数据是灰色和斜体。我希望数据（值）是正常的和黑色的，只有标题是斜体和灰色的。

有什么想法吗？

【问题讨论】：

【解决方案1】：

您可以使用 CSS3 进行自定义解决方案。

看看How to change the style of Title attribute inside the anchor tag?。但我是否可以建议您使用像“数据标题”这样的自定义字段，以便默认浏览器行为不会干扰您的自定义解决方案。

【讨论】：

【解决方案2】：

您可以在<h2></h2> 中添加输入的标题，然后从 css 更改标题的属性，如下所示：

h2 {
    font-style: italic;
    color: gray;
    font-size: 1em;
}

【讨论】：

【解决方案3】：

input[type="text"][title]:hover:after {
  font-style: italic;
  color: red;
}

&lt;input type="text" title="here is a title" /&gt;

【讨论】：