css里鼠标悬停变色怎么弄 css里鼠标悬停变色怎么设置？
\u5728CSS\u4e2d\u5982\u4f55\u8bbe\u7f6e\u4e00\u4e2a\u6309\u94ae\u9f20\u6807\u5212\u8fc7\u53d8\u989c\u8272\u3002\u9700\u8981\u51c6\u5907\u7684\u6750\u6599\u5206\u522b\u6709\uff1a\u7535\u8111\u3001\u6d4f\u89c8\u5668\u3001html\u7f16\u8f91\u5668\u3002
1\u3001\u9996\u5148\uff0c\u6253\u5f00html\u7f16\u8f91\u5668\uff0c\u65b0\u5efahtml\u6587\u4ef6\uff0c\u4f8b\u5982\uff1aindex.html\u3002
2\u3001\u5728index.html\u4e2d\u7684\u6807\u7b7e\u4e2d\uff0c\u8f93\u5165css\u4ee3\u7801\uff1abutton {background-color: #00a7d0}button:hover {background-color: #ff7701}\u3002
3\u3001\u6d4f\u89c8\u5668\u8fd0\u884cindex.html\u9875\u9762\uff0c\u6b64\u65f6\u663e\u793a\u51fa\u4e86\u84dd\u8272\u80cc\u666f\u989c\u8272\u7684\u6309\u94ae\u3002
4\u3001\u5c06\u9f20\u6807\u79fb\u5165\u6309\u94ae\uff0c\u6b64\u65f6\u6309\u94ae\u7684\u80cc\u666f\u989c\u8272\u53d8\u6210\u4e86\u6a59\u8272\u3002
css\u4e2d\u60ac\u505c\u6539\u53d8\u6837\u5f0f\u7684\u6700\u597d\u65b9\u6cd5\u662f\u7528\u4f2a\u7c7b\u9009\u62e9\u5668 div:hover{}\u3002css\u4ee3\u7801\u793a\u4f8b\u5982\u4e0b\uff1a
div{ width:100px; height:200px; background:#000;}
div:hover{ background:#fff;}
\u8fd9\u662f\u4e00\u4e2a\u4fee\u6539\u80cc\u666f\u989c\u8272\u7684\u793a\u4f8b\uff0c\u4f2a\u7c7b\u91cc\u53ef\u4ee5\u4fee\u6539\u8ddf\u591a\u7684\u6837\u5f0f\uff0c\u5bbd\u5ea6\uff0c\u9ad8\u5ea6\u6216\u8005\u5b57\u4f53\u5927\u5c0f\uff0c\u5b57\u4f53\u989c\u8272\u90fd\u662f\u53ef\u4ee5\u4fee\u6539\u7684\u3002
1、首先新建一个html文件，命名为test.html，在test.html文件内，使用table标签创建一个表格，用于测试。
2、在test.html文件内，设置table标签的class属性为mytable，同时设置边框为1px。
3、接着在css标签内，通过class设置表格的样式，定义它的宽度为300px,高度为200px。
4、在css标签内，通过td元素名称和“:hover”选择器定义当鼠标指向单元格时，改变单元格的背景颜色，设置为红色。
5、最后在浏览器打开test.html文件，鼠标经过之后，即可变色。
css中悬停改变样式的最好方法是用伪类选择器 div:hover{}。css代码示例如下：
div{ width:100px; height:200px; background:#000;}
div:hover{ background:#fff;}
这是一个修改背景颜色的示例，伪类里可以修改跟多的样式，宽度，高度或者字体大小，字体颜色都是可以修改的。
全局就用
a:hover{color:#ed8039;}
局部就定位到你ID或者class所在的A链接里
#test a:hover{color:#ed8039;}
a:hover{
color:#FF0000;
}
a{color: red;}
a:hover{color: blue;}
绛旓細浠ヤ笅鏄竴浜涘父瑙佺殑鐢ㄦ硶锛1銆佹敼鍙橀紶鏍囨偓鍋滄椂鐨勫厓绱犳牱寮銆備緥濡傦紝a锛歨over{color锛歳ed}锛屽綋榧犳爣鎮仠鍦ㄩ摼鎺ヤ笂鏃讹紝閾炬帴鐨勯鑹插皢鍙樹负绾㈣壊銆2銆佹敼鍙樺瓙鍏冪礌鏍峰紡銆備緥濡傦紝child锛歨over{background-color锛歱ink}锛屽綋榧犳爣鎮仠鍦ㄥ寘鍚玞hild鐨勫厓绱犱笂鏃讹紝child鐨勮儗鏅鑹插皢鍙樹负绮夎壊銆3銆佹敼鍙樺悓绾у厓绱狅紙鍏勫紵鍏冪礌锛夋牱寮忋備緥濡...
绛旓細1銆佹柊寤篽tml鏂囦欢锛屽湪body鏍囩涓坊鍔犱竴涓猟iv鏍囩锛宒iv鏍囩閲岄潰宓屽涓涓猵鏍囩锛岀劧鍚庢坊鍔爌鏍囩鍐呭锛岃繖閲屼互鈥滄紨绀烘枃鏈濅负渚嬶細2銆佸湪head鏍囩涓坊鍔爏tyle鏍囩锛岀劧鍚庡湪style鏍囩涓粰p鏍囩璁剧疆棰勫厛鏄剧ず鏍峰紡锛岄鍏堟槸鍏堜笉鏄剧ず鐨勶紝鎵浠ョ粰p鏍囩璁剧疆鐨勫睘鎬т唬鐮佹槸鈥減 {display: none; }鈥濓紱鍐嶇粰div璁剧疆瀹藉拰楂橈紝杩欓噷...
绛旓細鍦CSS涓锛屼綘鍙互閫氳繃绠鍗曠殑鏍峰紡璁剧疆瀹炵幇榧犳爣鎮仠鏃跺瓧浣棰滆壊鐨勫彉鍖栥備互涓嬫槸濡備綍鎿嶄綔鐨勬楠わ細棣栧厛锛屼粠澶村紑濮嬶紝鎵撳紑浣犵殑HTML缂栬緫鍣紝鏂板缓涓涓枃浠讹紝渚嬪鍙畠"index.html"銆傚湪index.html鐨勯儴鍒嗭紝娣诲姞鏍囩锛岃繖鏄瓨鏀綜SS浠ｇ爜鐨勫湴鏂广傚湪杩欓噷锛屼綘鍙互涓哄瓧浣撻鑹茶缃竴涓熀纭鏍峰紡銆傛瘮濡傦紝浣犲彲浠ヨ繖鏍峰啓锛歜utton{color:...
绛旓細1銆侀鍏堟柊寤轰竴涓猦tml鏂囦欢锛屽懡鍚嶄负test.html锛屽湪test.html鏂囦欢鍐咃紝浣跨敤table鏍囩鍒涘缓涓涓〃鏍硷紝鐢ㄤ簬娴嬭瘯銆2銆佸湪test.html鏂囦欢鍐咃紝璁剧疆table鏍囩鐨刢lass灞炴т负mytable锛屽悓鏃惰缃竟妗嗕负1px銆3銆佹帴鐫鍦css鏍囩鍐咃紝閫氳繃class璁剧疆琛ㄦ牸鐨勬牱寮忥紝瀹氫箟瀹冪殑瀹藉害涓300px,楂樺害涓200px銆4銆佸湪css鏍囩鍐咃紝閫氳繃td鍏冪礌鍚嶇О...
绛旓細1銆佷娇鐢–SS閫夋嫨鍣ㄥ拰浼被锛氳幏鍙栬淇敼鏍峰紡鐨勫厓绱锛屼娇鐢–SS閫夋嫨鍣ㄩ変腑瑕佹搷浣滅殑鍏冪礌锛屽苟浣跨敤浼被鈥滐細hover鈥濇潵鎸囧畾褰撻紶鏍囨偓鍋滃湪璇ュ厓绱犱笂鏃跺簲鐢ㄧ殑鏍峰紡銆2銆佹寚瀹氳搴旂敤鐨勬牱寮忥細渚嬪锛屽鏋滄偍鏈変竴涓厓绱營D涓衡渢arget鈥濓紝闇瑕佸皢鍏堕鑹叉洿鏀逛负绾㈣壊锛屽綋榧犳爣绉诲埌ID涓衡渢rigger鈥濈殑鍏冪礌涓婃椂锛屽彲浠ヤ娇鐢ㄤ互涓嬩唬鐮侊細#...
绛旓細鍥炵瓟锛css("color","#ff9501"); 杩欏彞涓棿鏄啋鍙,涓嶆槸閫楀彿 鏍囩偣閿欎簡,鎵浠ヨВ鏋愪笉鍑烘潵,鏀逛负: css("color":"#ff9501");
绛旓細 a{display:block;width:120px;height:35px;background:#cccccc;color:#ffffff;float:left;} a:hover{background:#000000;} home about issues sssss XXXXX
绛旓細css涓偓鍋鏀瑰彉鏍峰紡鐨勬渶濂芥柟娉曟槸鐢ㄤ吉绫婚夋嫨鍣╠iv:hover{}銆俢ss浠ｇ爜绀轰緥濡備笅锛歕x0d\x0a\x0d\x0adiv{width:100px;height:200px;background:#000;}\x0d\x0adiv:hover{background:#fff;}\x0d\x0a\x0d\x0a杩欐槸涓涓慨鏀硅儗鏅棰滆壊鐨勭ず渚嬶紝浼被閲屽彲浠ヤ慨鏀硅窡澶氱殑鏍峰紡锛屽搴︼紝楂樺害鎴栬呭瓧浣撳ぇ灏...
绛旓細1銆侀鍏堬紝鎵撳紑html缂栬緫鍣紝鏂板缓html鏂囦欢锛屼緥濡傦細index.html銆2銆佸湪index.html涓殑鏍囩涓紝杈撳叆css浠ｇ爜锛歜utton {background-color: #00a7d0}button:hover {background-color: #ff7701}銆3銆佹祻瑙堝櫒杩愯index.html椤甸潰锛屾鏃舵樉绀哄嚭浜嗚摑鑹茶儗鏅棰滆壊鐨鎸夐挳銆4銆佸皢榧犳爣绉诲叆鎸夐挳锛屾鏃舵寜閽殑鑳屾櫙棰滆壊鍙樻垚浜嗘...
绛旓細鐩存帴鍦℉TML涓缃榧犳爣鎮仠鏃跺瓧浣鍙樿壊鐨姝ラ濡備笅锛氶鍏堬紝浣犻渶瑕佸皢鎯冲彉鑹茬殑鏂囧瓧鍖呭惈鍦℉TML鐨勪竴涓厓绱犱腑锛屾瘮濡傛爣绛俱傝繖涓姝ュ彲浠ラ氳繃鍦ㄩ儴鍒嗗垱寤轰竴涓爣绛撅紝骞跺湪鍏朵腑杈撳叆浣犵殑鏂囧瓧鏉ュ疄鐜般傜劧鍚庯紝涓鸿繖涓爣绛炬坊鍔CSS鏍峰紡锛岀壒鍒槸hover浼被銆傚綋榧犳爣鎮仠鍦ㄦ爣绛句笂鏃讹紝杩欎釜浼被浼氳Е鍙戜綘棰勮鐨勬牱寮忔敼鍙樸備緥濡傦紝浣犲彲浠ヨ缃...
