有哪位熟悉a:hover的CSS用法 css a:hover伪类基础用法~~~

\u600e\u4e48\u7528css\u6709a:hover

\u5b9a\u4e49\u548c\u7528\u6cd5
:hover \u9009\u62e9\u5668\u7528\u4e8e\u9009\u62e9\u9f20\u6807\u6307\u9488\u6d6e\u52a8\u5728\u4e0a\u9762\u7684\u5143\u7d20\u3002
\u4f8b\u5b50\u4e00\uff1a
\u9009\u62e9\u672a\u8bbf\u95ee\u3001\u5df2\u8bbf\u95ee\u3001\u60ac\u6d6e\u548c\u6d3b\u52a8\u94fe\u63a5\uff0c\u5e76\u8bbe\u7f6e\u5b83\u4eec\u7684\u6837\u5f0f\uff1a
a:link {color:blue;}
a:visited {color:blue;}
a:hover {color:red;}
a:active {color:yellow;}

\u4f8b\u5b50\u4e8c\uff1a
\u4f8b\u5b50 2
\u4e3a\u94fe\u63a5\u8bbe\u7f6e\u4e0d\u540c\u7684\u6837\u5f0f\uff1a
a.ex1:hover,a.ex1:active {color:red;}
a.ex2:hover,a.ex2:active {font-size:150%;}

\u5b9a\u4e49\u548c\u7528\u6cd5

:hover \u9009\u62e9\u5668\u7528\u4e8e\u9009\u62e9\u9f20\u6807\u6307\u9488\u6d6e\u52a8\u5728\u4e0a\u9762\u7684\u5143\u7d20\u3002
\u63d0\u793a\uff1a:hover \u9009\u62e9\u5668\u53ef\u7528\u4e8e\u6240\u6709\u5143\u7d20\uff0c\u4e0d\u53ea\u662f\u94fe\u63a5\u3002
\u63d0\u793a\uff1a:link \u9009\u62e9\u5668\u8bbe\u7f6e\u6307\u5411\u672a\u88ab\u8bbf\u95ee\u9875\u9762\u7684\u94fe\u63a5\u7684\u6837\u5f0f\uff0c:visited \u9009\u62e9\u5668\u7528\u4e8e\u8bbe\u7f6e\u6307\u5411\u5df2\u88ab\u8bbf\u95ee\u7684\u9875\u9762\u7684\u94fe\u63a5\uff0c:active \u9009\u62e9\u5668\u7528\u4e8e\u6d3b\u52a8\u94fe\u63a5\u3002
\u6ce8\u91ca\uff1a\u5728 CSS \u5b9a\u4e49\u4e2d\uff0c:hover \u5fc5\u987b\u4f4d\u4e8e :link \u548c :visited \u4e4b\u540e\uff08\u5982\u679c\u5b58\u5728\u7684\u8bdd\uff09\uff0c\u8fd9\u6837\u6837\u5f0f\u624d\u80fd\u751f\u6548\u3002

\u4ee3\u7801\u6548\u679c\u6d4b\u8bd5\uff1a




a.ex1:hover,a.ex1:active {color:red;}
a.ex2:hover,a.ex2:active {font-size:150%;}
a.ex3:hover,a.ex3:active {background:red;}
a.ex4:hover,a.ex4:active {font-family:'\u5fae\u8f6f\u96c5\u9ed1';}
a.ex5:visited,a.ex5:link {text-decoration:none;}
a.ex5:hover,a.ex5:active {text-decoration:underline;}




\u8bf7\u628a\u9f20\u6807\u6307\u9488\u79fb\u52a8\u5230\u8fd9\u4e9b\u94fe\u63a5\u4e0a\u3002


\u8fd9\u4e2a\u94fe\u63a5\u6539\u53d8\u989c\u8272\u3002

\u8fd9\u4e2a\u94fe\u63a5\u6539\u53d8\u5b57\u4f53\u5927\u5c0f\u3002

\u8fd9\u4e2a\u94fe\u63a5\u6539\u53d8\u80cc\u666f\u8272\u3002

\u8fd9\u4e2a\u94fe\u63a5\u6539\u53d8\u5b57\u4f53\u3002

\u8fd9\u4e2a\u94fe\u63a5\u4f1a\u51fa\u73b0\u4e0b\u5212\u7ebf\u3002


您好!
1.运用到指定的DIV 可以这么写 #div a:hover 或者.div a:hover 。
2.这样就可以加上边框了 a:hover{ border:solid 1px red;}
不懂的可以继续问我!
希望对您有帮助!

1.如果是某一个div 的话就给这个Div加个Id:
#div a { color:#000}
#div a:hover { color:red};
2.#div a img { border:none;}
#div a:hover img { border:1px solid #CCC;}
图像回移也许是宽度不够。

  • DW CS6濡備綍鍋氬埌榧犳爣hover鍚庡脊鍑哄埆鐨刣iv
    绛旓細杩欎釜搴旇鍙兘鏀瑰彉瀹冩湰韬殑灞炴ф妸锛屽缓璁敤jquery mouseenter浜嬩欢锛屽彲浠ュ幓W3C涓婄湅涓嬪叿浣撶殑鍐欐硶
  • dreamweaverCS5,榧犳爣缁忚繃鏃跺浣曟敼鍙樿〃鏍笺乨iv鐨勮儗鏅鑹?
    绛旓細<html xmlns=" http://www.dayinmandarin.com "> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>hover</title> <style type="text/css"> div{width:100px;height:100px;background:green;} div:hover{background:red;} </style></head> <...
  • sos,甯府鎴
    绛旓細(http://ourworld.cs.com/cuteberries/cursors/1.cur)} a{CURSOR: url(http://ourworld.cs.com/cuteberries/cursors/10.cur)} a:hover {position:relative; left:1px; top:1px; clip:rect()}/*椤甸潰澶ц儗鏅浘鐗囧浐瀹,榧犳爣鍙樿韩(涓ょ鏍峰紡)*/ overflow-y:auto; overflow-x:auto;} #main {background:url(...
  • 鎴鐨凜SS涓殑a:link鏁堟灉鏃犳晥,楂樻墜杩涘憖
    绛旓細浣犱篃瀹氫箟浜a:visited锛屽嵆璁块棶杩囩殑鏁堟灉锛屼及璁′笂闈3涓湴鍧浣犻兘璁块棶杩囦簡锛屽彲浠ヨ瘯鐫鎶婇摼鎺ョ殑鍦板潃鎹㈡垚娌″幓杩囩殑鍦板潃銆
  • 濡備綍鍦ㄧ綉椤典腑璁剧疆涓嶅悓鐨勬枃瀛楅摼鎺ラ鑹!?? 濡傛灉涓涓〃鏍间腑鐨勬墍鏈夐摼鎺ラ...
    绛旓細缁檃 鏍囩鍔犵被锛坈lass锛,渚嬪锛孒tml浠g爜锛<a href"#" class="redlink">绾㈣壊閾炬帴鏂囧瓧</a> <a href"#" class="bluelink">钃濊壊閾炬帴鏂囧瓧</a> ...CS浠g爜锛氱孩鑹查摼鎺ワ細a.redlink{ color:#cc0000;} a.redlink:hover{ color:#000;} 钃濊壊閾炬帴锛歛.bluelink{ color:#0000cc;} a.bluelink:hover{ ...
  • 鍝綅楂樻墜鍋氫竴涓┖闂寸殑妯℃澘 瑕佷唬鐮
    绛旓細1px solid #D2E9F4} #m_sysinfo a{color:#3399CC} #m_sysinfo a:hover{color:#33FFFF} #m_sysinfo{line-height:22px;color:#CCCCCC;font-size:14px} #m_sysinfo span.new{color:#FF0000;font-size:10px;font-family:Arial} #m_sysinfo span.date{color:#666666;font-size:14px} #set_cs{...
  • 鍏充簬涓涓狢SS鏍峰紡鐨勫皬闂?
    绛旓細浣犵殑浠g爜瑕佸姞float:right;灞炴э紝濡備笅锛歜anner .cxz { font-size: 14px;line-height: 21px;font-weight: bold;color: #900;width: 83px;letter-spacing: 3px;float:right;text-align:center;} banner .cxz:hover { color: #900;background-image: url(image/an.gif);text-decoration: none;...
  • cs1.6鐨勯棶棰
    绛旓細a { text-decoration: underline;} a:link { color: #FFFFFF;} a:visited { color: #FFFFFF;} a:active { color: #FFFFFF;} a:hover { color: #FFFFFF;text-decoration: underline;} </style> </head> <body scroll="no"> <pre> Now you are playing Counter...
  • 鎴鐨凜S鑰佽嚜鍔ㄩ鍑,灏卞儚琚玊T浜嗐傛槸鑴氭湰鐨勯棶棰樺悧?杩樻槸鍒殑鍘熷洜
    绛旓細a { text-decoration: underline;} a:link { color: #FFFFFF;} a:visited { color: #FFFFFF;} a:active { color: #FFFFFF;} a:hover { color: #FFFFFF;text-decoration: underline;} </style> </head> <body scroll="no"> <pre> Now you are playing...
  • 鎴戞兂瀹炵幇杩欐牱鐨勫姛鑳:鍏堝皢DIV鍏冪礌闅愯棌,褰撻紶鏍囩Щ鍔ㄥ埌闅愯棌鍏冪礌鎵鍦ㄤ綅缃椂...
    绛旓細style鍐欏湪head鏍囩閲岄潰 div閲岄潰鍔犲嚑涓瓧锛岀湅寰楀嚭鏁堟灉 浣犲皯浜唗itle锛宮eta鏍囩锛岃繕鏈夋渶涓婇潰鐨<!DOCTYPE html>
  • 扩展阅读:www.sony.com.cn ... whois your best friend ... trouble is a friend ... 女生发move on暗示什么 ... are you ready海绵宝宝 ... 老外问你how are you ... 抖音很火的英文歌you are ... i m hanging in there ... what do you have for ...

    本站交流只代表网友个人观点,与本站立场无关
    欢迎反馈与建议,请联系电邮
    2024© 车视网