Home > Web Front-end > HTML Tutorial > How to make the entire line (tr) change color when the mouse is stopped in HTML

How to make the entire line (tr) change color when the mouse is stopped in HTML

小云云
Release: 2017-12-11 10:16:31
Original
2077 people have browsed it

This article mainly introduces the relevant information in HTML to realize the color change of the entire line (tr) when the mouse is stopped. Friends in need can refer to it. I hope it can help everyone.

Use pure CSS to realize that when the mouse passes over a certain row of a table, the background color of the entire row changes to indicate that the row is in focus:

<html >
<head>
<meta charset="utf-8"/>
<title>change</title>
<style type="text/css">
  tr.change:hover
  {
    background-color:#00FF00
  }
</style>
</head>
<body>
<h1>鼠标经停变色</h1>
<table width="80%" border="1" align="center">
  <tr class="change">
    <td> </td>
    <td> </td>
  </tr>
  <tr class="change">
    <td> </td>
    <td> </td>
  </tr>
</table>
</body>
</html>
Copy after login

Have you learned it? This basic knowledge is very useful in development.

Related recommendations:

HTML implementation of simple prompt box

HTML5 desktop notification prompt function implementation

Notes on table nesting in HTML

The above is the detailed content of How to make the entire line (tr) change color when the mouse is stopped in HTML. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template