1、纯css  获取子元素
#test1>div {background-color:red;}
#test1 div {font-size:14px;}
#test1>div:first-child {color:#ccc;}
性别
男
因1示例中为#test1下的子元素 #test1>div 余#test1 div 并没有区别。做如下示例：
h1> strong {color:red;}
this is very very important.
this is really very important. 
h1  strong {color:red;}
2、jquery css 获取子元素
$(function(){
     $(#button1).click(function(){
         $(#test1>div).html(姓名);
         $(#test1>div).next().html(张三);  //若注释这步，两个div都为“姓名”。
         $(#test1 div).css(color,green)
         $(#test1>div:first).css(font-size,24px);
  });
});
3 、jquery 获取子元素 find() 与children()
$(function(){
     $('ul.level-1').children().css('border', '1px solid green');
     $('ul.level-2').find('li').css('border', '1px solid red');
     $(#p1).html(children li长度:+$(ul.level-1).children(li).length); 
     $(#p2).html(find li长度:+$(ul.level-1).find(li).length);
 });
list1
list1-1
list1-1-1
                     list1-1-2
list1-2
list2
list2-1
            list2-2
list3
list3-1
            list3-2
children和find的区别：children只会查找直接子集，而find会跨越层级查找，一直找到没有为止。