如何将HTML CSS设计应用于TreeView控件

时间:2015-08-11 16:12:30

标签: html css asp.net twitter-bootstrap treeview

我在ASP.NET中有一个动态创建的树视图控件。我想格式化树视图控件并想要应用一些设计。我已经在stackoverflow上找到了这个,但我不知道我是否可以应用于我动态创建的Treeview控件?

这是我在树视图的stackoverflow上找到的链接

https://jsfiddle.net/jhfrench/GpdgF/

这是我的代码     

    $attributeSetModel = Mage::getModel("eav/entity_attribute_set");
    $attributeSetModel->load($product->getAttributeSetId());
    $attributeSetName  = $attributeSetModel->getAttributeSetName();
    $attributeSetID  = $attributeSetModel->getAttributeSetID();

$groups = Mage::getModel('eav/entity_attribute_group')
->getResourceCollection()
->setAttributeSetFilter($attributeSetID)
->setSortOrder()
->load();

$attributeCodes = array();
foreach ($groups as $group) {
echo $groupName          = $group->getAttributeGroupName();
$groupId            = $group->getAttributeGroupId();

if (strpos($groupName , 'Specifications') !== false) {
    echo 'true';
    $specificationsNum = $groupId;
};
if (strpos($groupName , 'eatures') !== false) {
    echo 'true';
    $prodfeaturesNum = $groupId;
};
}
//echo $specifications;
$specifications = Mage::getResourceModel('eav/entity_attribute_collection')
->setAttributeGroupFilter($specificationsNum); 
$prodfeatures = Mage::getResourceModel('eav/entity_attribute_collection')
->setAttributeGroupFilter($prodfeatures); 

请让我知道如何将此样式应用于动态添加的树视图控件。

2 个答案:

答案 0 :(得分:0)

您可以使用ASP:TreeView的CSSClass属性将CSS应用于TreeView控件

答案 1 :(得分:0)

检查这个!这将有助于你

 .treeNode
        {
            transition: all .3s;
            padding: 12px 5px;
            text-align: center;
            /*width: 100%;*/
            margin: 0;
            min-width: 250px !important;
            border: 2px solid #8e44ad;
            text-decoration:none !important;
            color:black;
            /*color:blue;
            font:14px Arial, Sans-Serif;*/
        }
     .rootNode
        {
            font-size:18px;
            /*width:100%;*/
            border-bottom:Solid 1px black;
            color:#337ab7;
        }
     .leafNode {
            border: Dotted 2px black;
            padding: 10px;
            background-color: #eeeeee;
            font-weight: bold;
        }
     .selectNode 
   {
        background-color:Black;
        border:Dotted 2px black;
        font-weight:bold;
        color:#fff;
    }

<asp:TreeView ID="tvw_Category"  runat="server" NodeStyle-CssClass="treeNode"
    RootNodeStyle-CssClass="rootNode"
    LeafNodeStyle-CssClass="leafNode" SelectedNodeStyle-CssClass="selectNode" 
                 OnTreeNodeCheckChanged  ="tvw_Category_TreeNodeCheckChanged"  ExpandDepth="1"  Font-Size="Small">
                        </asp:TreeView>