Home >Web Front-end >HTML Tutorial >Please teach me how to change the font color of label and a in a td_html/css_WEB-ITnose
Please teach me how to change the font color of label and a in a td_html/css_WEB-ITnose
- WBOYOriginal
- 2016-06-24 12:01:532785browse
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><style type="text/css">.change td:hover{ color:#56ae2e;}#table1{ border:none;width:102%;height:100%; border-style:none; margin-left:-2px;margin-top:-2px; }#table1 tr{ width:100%;height:5.5%; text-align:center;font-size:16px; }#table1 tr td:hover{ color:#56ae2e; } #table1 tr td a{ font-weight: bold; color: #2f2e2e;text-decoration: none;font-size:16px; margin-right:25%; }#table1 tr td span:hover{ color:#56ae2e; }</style><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title></head><body><div id="div1" style="float:left;width:100px;height:600px;margin-top:5px;border:solid;border-color:#56ae2e;border-width:2px;"> <table id="table1" > <tr bgcolor="#56ae2e"><td> <a href="#" style="font-weight: bold; color:#FFFFFF;text-decoration: none;" >农资卖场</a></td></tr> <tr class="change"><td><a href="#" >种子</a><label>></label></td></tr> <tr class="change"><td><span id="span1"> <a href="#">农药</a><label>></label></span></td></tr> <tr><td> <a href="#">化肥</a><label>></label></td></tr> <tr><td> <a href="#">饲料</a><label>></label></td></tr> <tr><td> <a href="#">兽药</a><label>></label></td></tr> <tr><td> <a href="#">农机</a><label>></label></td></tr> </table> </div></body></html> Please help, how can I set the css to change the color of a and label in a td at the same time when the mouse passes over it? This is very troublesome. .
Reply to discussion (solution)
#table1 tr td:hover a{color: #f00;}#table1 tr td:hover label{color: #f00;} <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head> <style type="text/css"> .change td:hover{ color:#56ae2e;} #table1{ border:none;width:102%;height:100%; border-style:none; margin-left:-2px;margin-top:-2px; } #table1 tr{ width:100%;height:5.5%; text-align:center;font-size:16px; } #table1 tr td:hover{ color:#56ae2e; } #table1 tr td:hover a{color: #f00;} #table1 tr td:hover label{color: #f00;} #table1 tr td a{ font-weight: bold; color: #2f2e2e;text-decoration: none;font-size:16px; margin-right:25%; } #table1 tr td span:hover{ color:#56ae2e; } </style> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>无标题文档</title></head><body><div id="div1" style="float:left;width:100px;height:600px;margin-top:5px;border:solid;border-color:#56ae2e;border-width:2px;"> <table id="table1" > <tr bgcolor="#56ae2e"><td> <a href="#" style="font-weight: bold; color:#FFFFFF;text-decoration: none;" >农资卖场</a></td></tr> <tr class="change"><td><a href="#" >种子</a><label>></label></td></tr> <tr class="change"><td><span id="span1"> <a href="#">农药</a><label>></label></span></td></tr> <tr><td> <a href="#">化肥</a><label>></label></td></tr> <tr><td> <a href="#">饲料</a><label>></label></td></tr> <tr><td> <a href="#">兽药</a><label>></label></td></tr> <tr><td> <a href="#">农机</a><label>></label></td></tr> </table></div></body></html>
Thanks! It’s so hard for a newbie to put on shelves.
Thanks! It’s so hard for a newbie to put it on the shelf...
You’re welcome, I’ll post it once you’ve solved it. Also, you can check out my series of tutorials, which should be helpful to newbies:
http://www. cnblogs.com/jikey/p/3613082.html
Statement：
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