javascript - Css 颜色 Jquery UI

Question

我正在尝试使用 CSS 更改某些可排序的 jQuery UI 的颜色: 检查这个 fiddle :

http://jsfiddle.net/fwcLd8mg/2/

当我设置 .default 背景时，所有框都会变成该颜色。 但是当我在每个列表中指定背景时，列表的背景会发生变化，而不是方框。

如何为框指定颜色？

CSS:

#sortable-5 {
background: #ff0000;
}
#sortable-6 {
background: #00b8ff;
}
#sortable-7{
background: #000000;
}
#sortable-5, #sortable-6,#sortable-7 { 
list-style-type: none; margin: 0; padding: 0;
width: 20%;float:left
}
#sortable-5 li, #sortable-6 li,#sortable-7 li { 
margin: 0 3px 3px 3px; padding: 0.4em; 
padding-left: 1.5em; font-size: 17px; height: 50px;
}
.default {
background: #b2f5fb;
border: 1px solid #DDDDDD;
color: #333333;
} 

Answer 1

您需要将颜色应用于 LI 元素。由于您已经为它们添加了一个 default 类，您可以使用它:

#sortable-5>.default {
    background: #ff0000;
}
#sortable-6>.default {
    background: #00b8ff;
}
#sortable-7>.default{
    background: #000000;
}

Updated fiddle