JSの入れ子リストの練習(forループ)_html/css_WEB-ITnose

*{padding: 0;margin: 0;}ul,li{list-style: none;}.cont{    width: 600px;    margin:30px auto;}.cont h3{    border-bottom: 2px solid #bbb;    width: 100%;    height: 38px;}#ul1{    position: relative;    width: 100%;}#ul1>li{    float: left;    margin-top: 15px;    margin-left: 15px;    position: relative;}.pro{    width: 180px;    height: 200px;    overflow: hidden;}.pro img{    width: 180px;    height: 150px;    overflow: hidden;}.pro p{    text-align: center;}.hidden{    display: none;}.active{    width: 300px;    height: 120px;    padding: 10px;    overflow: hidden;    position: absolute;    top: -80px;    left: 20px;    display: block;    background: #eee;    border: 1px solid #ccc;    z-index: 1;}.active li{    color: #e4007e;     font-size: 14px;    padding-left: 12px;    height: 30px;    line-height: 30px;}/* 清除浮动 */.clearfix{    zoom: 1;}.clearfix:after{     content: '.';    height: 0;    display: block;    clear: both;    visibility: hidden;}