如何將樣式應用於kendo下拉列表中的一個元素？

Question

我目前正在嘗試劍道，我發現這個例子在線：

下面是ASP.NET MVC代碼：

<div class="demo-section"> 
<h2>View Order Details</h2> 
<p> 
    <label for="categories">Catergories:</label> 
    @(Html.Kendo().DropDownList() 
      .Name("categories") 
      .HtmlAttributes(new { style = "width:300px" }) 
      .OptionLabel("Select category...") 
      .DataTextField("CategoryName") 
      .DataValueField("CategoryId") 
      .DataSource(source => { 
       source.Read(read => { 
        read.Action("GetCascadeCategories", "ComboBox"); 
       }); 
      }) 
    ) 
    </p> 
    <p> 
    <label for="products">Products:</label> 
    @(Html.Kendo().DropDownList() 
      .Name("products") 
      .HtmlAttributes(new { style = "width:300px" }) 
      .OptionLabel("Select product...") 
      .DataTextField("ProductName") 
      .DataValueField("ProductID") 
      .DataSource(source => { 
       source.Read(read => 
       { 
        read.Action("GetCascadeProducts", "ComboBox") 
         .Data("filterProducts"); 
       }) 
       .ServerFiltering(true); 
      }) 
      .Enable(false) 
      .AutoBind(false) 
      .CascadeFrom("categories") 
    ) 
     <script> 
     function filterProducts() { 
      return { 
       categories: $("#categories").val() 
      }; 
     } 
    </script> 
    </p> 
    <p> 
    <label for="orders">Orders:</label> 
    @(Html.Kendo().DropDownList() 
      .Name("orders") 
      .HtmlAttributes(new { style = "width:300px" }) 
      .OptionLabel("Select order...") 
      .DataTextField("ShipCity") 
      .DataValueField("OrderID") 
      .DataSource(source => { 
       source.Read(read => 
       { 
        read.Action("GetCascadeOrders", "ComboBox") 
         .Data("filterOrders"); 
       }) 
       .ServerFiltering(true); 
      }) 
      .Enable(false) 
      .AutoBind(false) 
      .CascadeFrom("products") 
    ) 
    <script> 
     function filterOrders() { 
      return { 
       products: $("#filterOrders").val() 
      }; 
     } 
    </script> 
    </p> 
    </div> 
    <script> 
    $(document).ready(function() { 
    var categories = $("#categories").data("kendoDropDownList"), 
     products = $("#products").data("kendoDropDownList"), 
     orders = $("#orders").data("kendoDropDownList"); 

     $("#get").click(function() { 
     var categoryInfo = "\nCategory: { id: " + categories.value() + ", name: " + categories.text() + " }", 
      productInfo = "\nProduct: { id: " + products.value() + ", name: " + products.text() + " }", 
      orderInfo = "\nOrder: { id: " + orders.value() + ", name: " + orders.text() + " }"; 

     alert("Order details:\n" + categoryInfo + productInfo + orderInfo); 
    }); 
}); 
</script> 
<style scoped> 
.demo-section { 
    width: 460px; 
    padding: 30px; 
} 
.demo-section h2 { 
    text-transform: uppercase; 
    font-size: 1.2em; 
    margin-bottom: 30px; 
} 
.demo-section label { 
    display: inline-block; 
    width: 120px; 
    padding-right: 5px; 
    text-align: right; 
} 
.demo-section .k-button { 
    margin: 20px 0 0 125px; 
} 
.k-readonly 
{ 
    color: gray; 
} 

這裏與交互式演示和源代碼的網站： http://demos.telerik.com/kendo-ui/web/dropdownlist/cascadingdropdownlist.html

我想知道如果我希望單詞「選擇類別...」或「選擇產品...」在該字體樣式的斜體下拉列表中和只有那個元素（下拉列表的第一個元素），我該怎麼做？

當前.HtmlAttributes(new { style = "width:300px" })（例如）將樣式應用於列表中的所有元素。我怎樣才能使它只適用於列表中的一個元素？

Answer 1

您必須手動應用樣式指定爲使用類似於

$("#myDropDownList").find(".k-select").css("background-color", "yellow");