关于前端:修改DOM标签的title属性样式

任何表圈都能够增加一个title属性，当鼠标hover下来的时候将title的value展现进去。
然而理论场景中title的款式比较简单以及呈现的工夫是要等hover下来一段时间后再显示进去。

优化项：
1：title的款式
2：鼠标hover即展现title内容
3：全局批改

PS：我晓得当初很多UI框架有tooltip。然而有时候只是一个简略的属性展现且应用范畴较广，没有必要应用UI组件。

批改形式：
1：title属性改为data-title(或者任意你认为适合的名字，留神css中类型选择器和after的content的attr名称同步批改即可。这样能够防止原始title的反复呈现
2：本例次要修了批改title的即时性问题，所以款式没有做太多批改，你能够按需批改在:after中

[data-title] {        &:hover {            position: relative;            &:after {                content: attr(data-title);                position: absolute;                top: 20px;                left: 10px;                color: #666;                font-size: 10px;                border: 1px solid #ddd;                background-color: #fff;                z-index: 20;                line-height: 1.5;                font-style: normal;//本例中data-title为i标签属性                white-space: nowrap;                padding: 0 5px;            }        }    }

批改款式：