将CSS声明合并成一个可能吗？

我在设计传单中的地图。我想实现的是在单张地图在这个photoshoped例如添加HTML标签，每个标记上，如：

enter image description here

确定每个标签，以显示它的代码是：

HTML

<table> 
    <tr> 
     <td class="red"></td> 
     <td class="yellow"></td> 
     <td class="orange"></td> 
     <td class="blue"></td> 
    </tr> 
</table>

CSS

table{ 
    border-collapse: collapse; 
} 
td{  
    padding:20px; 
    border:5px solid black; 
} 
.red{ 
    background-color:#F15E66; 
} 
.yellow{ 
    background-color:#FFDB64; 
} 
.orange{ 
    background-color:#F58326; 
} 
.blue{ 
    background-color:#85B1DE; 
}

检查https://jsfiddle.net/YameenYasin/cx1ka3Ly/为实时代码。

好的问题出现时，传单标签只允许为每个标签添加一个唯一的CSS条目。例如：

marker.bindLabel('<table><tr><td class="red"></td><td class="yellow"></td><td class="orange"></td><td class="blue"></td></tr></table>', 
    {noHide: true, className: "onlyone", offset: [-10, -40] });

注意className：“onlyone”属性。我只能放一个CSS，并且在HTML代码中添加的“class”标签不会执行（它们不起作用）。

我的结论是，我需要将所有CSS代码添加到一个名为“onlyone”的类名中，以便我可以做className：“onlyone”。

这可能吗？

问候，

来源

2015-02-11 Egidi

你能告诉我们什么HTML/CSS实际呈现？你可以在检查员那里找到。 – dionyziz 2015-02-11 14:26:40

执行此代码时发生了什么？是 '

' 不被添加到所述标记？你在哪里看到类“唯一”被添加？ – ChrisJ 2015-02-11 14:27:07

@ChrisJ我可以在地图上看到每个标签中的“onlyone”类，但不显示红色，黄色，橙色和蓝色类。 – Egidi 2015-02-11 14:28:57

有可能通过使用nth-child如下“号”到一个类添加到tr然后瞄准孩子。

table { 
 
    border-collapse: collapse; 
 
} 
 
td { 
 
    padding: 20px; 
 
    border: 5px solid black; 
 
} 
 
.multi td:nth-child(1) { 
 
    background-color: #F15E66; 
 
} 
 
.multi td:nth-child(2) { 
 
    background-color: #FFDB64; 
 
} 
 
.multi td:nth-child(3) { 
 
    background-color: #F58326; 
 
} 
 
.multi td:nth-child(4) { 
 
    background-color: #85B1DE; 
 
}

<table> 
 
    <tr class="multi"> 
 
    <td></td> 
 
    <td></td> 
 
    <td></td> 
 
    <td></td> 
 
    </tr> 
 
</table>

来源

2015-02-11 14:28:22

给你： https://jsfiddle.net/cx1ka3Ly/2/

table{ 
    border-collapse: collapse; 
} 
td{  
    padding:20px; 
    border:5px solid black; 
} 
.onlyone:nth-child(1){ 
    background-color:#F15E66; 
} 
.onlyone:nth-child(2){ 
    background-color:#FFDB64; 
} 
.onlyone:nth-child(3){ 
    background-color:#F58326; 
} 
.onlyone:nth-child(4){ 
    background-color:#85B1DE; 
}

来源

2015-02-11 14:33:59 ChrisJ

将CSS声明合并成一个可能吗？

回答

相关问题