zoukankan      html  css  js  c++  java
  • 基础

    结构

    <div class="box">
    <ul>
    <li>
    <span>小学</span><span>3年级</span><span>5</span><span>周杰棍</span>
    </li>
    <li>
    <span>高中</span><span>2年级</span><span>3</span><span>双截伦</span>
    </li>
    <li>
    <span>小学</span><span>3年级</span><span>5</span><span>周杰棍</span>
    </li>
    <li>
    <span>高中</span><span>2年级</span><span>3</span><span>双截伦</span>
    </li>
    </ul>
    </div>

    样式

    .box {
    230px;
    }
    ul {
    list-style-type: none;
    }
    .box li {
    line-height: 30px;
    padding-left: 10px;
    }
    .box li span {
    margin-right: 5px;
    }
    .box li.special {
    font-weight:bold;">#d7d764 !important;
    }

    行为

    window.onload = function () {
    var aBox = document.getElementsByClassName("box");
    var aLi = aBox[0].getElementsByTagName("li");
    for(var i= 0,l=aLi.length; i<l; i++) {
    if (i%2) {
    aLi[i].style.backgroundColor = "#DDDDDD";
    } else {
    aLi[i].style.backgroundColor = "#cbc06c";
    }
         aLi[i].onmouseover = function () {
         this.className = "special";
         }  
         aLi[i].onmouseout= function () {
        this.className = "";
         }
         
    }
    }
  • 相关阅读:
    【Python】异常处理
    【Python】写入文件
    【Python】从文件中读取数据
    【Python】导入类
    【Python】继承
    【Python】使用类和实例
    SQL HAVING
    SQL GROUP BY
    SQL ORDER BY
    SQL CREATE INDEX
  • 原文地址:https://www.cnblogs.com/WeWeZhang/p/5727893.html
Copyright © 2011-2022 走看看