造型多个数据工具提示

Question

我使用data-tooltip创建了我的网站上的多个工具提示。问题是它是一个属性，所以我不能只在它前面应用一个类并使用它。所以，我要的是例如不同宽度的一个提示或不同颜色等

这是在CSS的例子为“数据工具提示”

[data-tooltip] { 
    position: relative; 
    z-index: 2; 
    cursor: pointer; 
} 

Answer 1

能否请您提供一些额外的HTML？

它可以使用类：

.my-class-1[data-tooltip] { 
    width: 100px; 
} 

.my-class-2[data-tooltip] { 
    width: 200px; 
} 

<div class="my-class-1" data-tooltip="true">...</div> 
<div class="my-class-2" data-tooltip="true">...</div> 

，或者您也可以使用其他数据属性：

[data-tooltip][data-tooltip-small] { 
    width: 100px; 
} 

[data-tooltip][data-tooltip-big] { 
    width: 200px; 
} 

<div data-tooltip="true" data-tooltip-small="true">...</div> 
<div data-tooltip="true" data-tooltip-big="true">...</div>