<!DOCTYPE html>

<html>

  <head>

    <title>colortable.html</title>

  <script language="javaScript">

      function changecolor(row){

         document.getElementById(row).style.backgroundColor='#CCCCFF';

      }

      function resetcolor(row){

         document.getElementById(row).style.backgroundColor='';

      }

  </script>

  </head>

  <body>

   <table width="200"border="1"cellspacing="1"cellpadding="1"align="center">

       <tr><th>学校</th><th>专业</th><th>人数</th></tr>

       <tr align="center"id="row1"onMouseOver="changecolor('row1')"onMouseOut="resetcolor('row1')">

       <th>北大</th><th>法律</th><th>2000</th>

       </tr>

       <tr align="center"id="row2"onMouseOver="changecolor('row2')"onMouseOut="resetcolor('row2')">

       <th>清华</th><th>计算机</th><th>5000</th>

       </tr>

           <tr align="center"id="row3"onMouseOver="changecolor('row3')"onMouseOut="resetcolor('row3')">

       <th>人大</th><th>经济</th><th>6000</th>

       </tr>

   </table>

  </body>

</html>

　　

JavaScript+CSS+DIV实现表格变色示例的更多相关文章

  1. 2017.9.24 基于HTML+JavaScript+CSS的开发案例&&JavaScript+CSS+DIV实现表格变色

    1.JavaScript+CSS+DIV实现下拉菜单 1.1 层标签<div> 基本语法: <div id="层编号" style="position: ...

  2. 表格变色示例中发现的问题——attr()与prop()

    在练习jQuery表格变色例子过程中,发现了一下几个问题: 在IEEdge浏览器中切换选中行会出现上一个表格行背景色被吃掉的情况: 在chrome中从上向下单击行中任意单元可以选中该行,而从下往上单击 ...

  3. JavaScript+CSS+DIV实现下拉菜单示例

    <!DOCTYPE html> <html> <head> <title>下拉菜单示例</title> <script languag ...

  4. JavaScript+css+ div HTML遮罩層效果

    <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Test</title ...

  5. CSS DIV中表格居中显示

    将div的text-align设为center,然后将table的margin设为auto,即: <div> <table style="margin:auto; widt ...

  6. 精通CSS+DIV基础总结（三）

    Div+CSS可是实现简单的网页设计,对于需要添加动作,更方便的交互,Javascript给我们提供了方便:数据的存储可以利用XML使其更加方便:而对于减少页面与服务器的交互,可以利用Ajax技术,与 ...

  7. 基于DIV+ul+li实现的表格(多示例)

    一个无序列表biaoge,前四个列表项我们赋予了类biaotou.因为这四个项是表格头部,应该与表格数据有所区别.所以单独赋予了类,可以方便控制.下面我们开始CSS代码的编写:由 www.169it. ...

  8. 鼠标经过图片时变换的两种方法--css+div及javascript应用

    javascript方式:    熟悉使用document.getElementById()取得节点对象 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTM ...

  9. JavaScript for循环实现表格隔行变色

    本代码主要演示的是for循环, <!doctype html> <html lang="en"> <head> <meta charset ...

随机推荐

  1. 雷林鹏分享: XML CDATA

    XML CDATA XML 文档中的所有文本均会被解析器解析. 只有 CDATA 区段中的文本会被解析器忽略. PCDATA - 被解析的字符数据 XML 解析器通常会解析 XML 文档中所有的文本. ...

  2. pip3 install requests Cannot open D:\Python35\Scripts\pip3-script.py

    1.问题描述: 使用pip(或pip3)指令安装模块时,出现了Cannot open D:\Python35\Scripts\pip3-script.py的报错信息 2.原因分析: pip安装出错 3 ...

  3. 20180831xlVBA_WorkbooksCosolidate

    Sub WorkbooksConsolidate() Rem 设置求和区域为 sheet名称/单元格区域;sheet名称/单元格区域 Const Setting As String = "S ...

  4. 20170821xlVBA隐藏空行

    Sub HideBlankRowsBetweenUsedRange() Dim URows As Range, i As Long, EndRow As Long With ActiveSheet E ...

  5. python记录_day04（补充）

    列表删除 切片删除 del lis[1:3]  # 删除索引是1,2的元素 修改 索引切片修改 # 修改 lst = ["太白", "太", "五&q ...

  6. Python while循环实现重试

    try: pass#要执行的代码 except: 状态=True while 状态==True: try: winsound.Beep(800, 1000)#报警提示音 循环=300 while 循环 ...

  7. Leetcode 5016. 删除最外层的括号

    5016. 删除最外层的括号  显示英文描述 我的提交返回竞赛   用户通过次数446 用户尝试次数469 通过次数456 提交次数577 题目难度Easy 有效括号字符串为空 ("&quo ...

  8. 解决Eureka Server不踢出已关停的节点的问题

    eureka端: eureka.server.enable-self-preservation (设为false,关闭自我保护主要) eureka.server.eviction-interval-t ...

  9. [CodeForces - 197D] D - Infinite Maze

    D - Infinite Maze We've got a rectangular n × m-cell maze. Each cell is either passable, or is a wal ...

  10. [LeetCode] 23. Merge k Sorted Lists ☆☆☆☆☆

    转载:https://leetcode.windliang.cc/leetCode-23-Merge-k-Sorted-Lists.html 描述 Merge k sorted linked list ...