淘宝店铺导航条CSS代码 淘宝店导航栏的CSS代码
\u6dd8\u5b9d\u5bfc\u822a\u6761css\u4ee3\u7801\u8fd9\u91cc\u662f\u4e24\u4e2a\u56fe\u6807\uff0c\u4f60\u6539\u989c\u8272\u6539\u4e0d\u4e86\u7684\uff0c\u4f60\u8981\u5199\u6837\u5f0f\uff0c\u628a\u4f60\u81ea\u5df1\u60f3\u8981\u5f04\u7684\u56fe\u6807\u505a\u597d\uff0c\u5199\u8fdb\u6837\u5f0f\u91cc\u9762\u5c31\u53ef\u4ee5\u4e86
\u8fd9\u662f\u5168\u90e8\u4ee3\u7801\uff0c\u5982\u679c\u4f60\u4f1aCSS\u7684\u53ef\u4ee5\u8bd5\u7740\u6539\u4e00\u4e0b\u5c31\u53ef\u4ee5\u7528\u4e86\u3002
\u8bbe\u7f6e\u5bfc\u822a\u6761\u7684\u80cc\u666f\u8272
/* \u5bfc\u822a\u680f\u80cc\u666f\u8272*/
.skin-box-bd .menu-list .link{background: none repeat scroll 0 0 #00ad08;}
/* \u5bfc\u822a\u5217\u8868\u80cc\u666f\u8272*/
.skin-box-bd .menu-list{background: none repeat scroll 0 0 #00ad08;}
/*\u5bfc\u822a\u6761\u6700\u53f3\u8fb9\u7684\u4e00\u90e8\u5206\u80cc\u666f*/
.skin-box-bd{background:#000000;}
--------------------------------------------------------------------------
\u8bbe\u7f6e\u5bfc\u822a\u6761\u5185\u7684\u201c\u6240\u6709\u5206\u7c7b\u201d
/*\u6240\u6709\u5206\u7c7b\u80cc\u666f\u8272*/
.all-cats .link{background: none repeat scroll 0 0 #00ad08;}
/*\u6240\u6709\u5206\u7c7b\u6587\u5b57\u6837\u5f0f*/
.all-cats .title{color:#\u989c\u8272\u4ee3\u7801;font-size:\u5b57\u53f7px;}
\u4fee\u6539\u201c\u6240\u6709\u5b9d\u8d1d\u201d\u53f3\u8fb9\u5c0f\u56fe\u6807\u4ee3\u7801\u5982\u4e0b\uff1a
.all-cats .link .popup-icon{background:url(\u56fe\u7247\u8fde\u63a5);}
------------------------------------------------------------------------------
\u8bbe\u7f6e\u5bfc\u822a\u6761\u5185\u7684\u4e00\u7ea7\u5206\u7c7b
/*\u4e00\u7ea7\u5206\u7c7b\u7684\u5206\u9694\u7ebf\uff0c\u5b9e\u9645\u4e0a\u5c31\u662f\u53f3\u8fb9\u6846\u7684\u989c\u8272*/
.skin-box-bd .menu-list .menu{border-right:1px #006205 solid;}
/*\u4e00\u7ea7\u5206\u7c7b\u7684\u6587\u5b57\u6837\u5f0f*/
.skin-box-bd .menu-list .menu .title{color:#\u989c\u8272\u4ee3\u7801;font-size:\u5b57\u53f7px;}
/*\u4e00\u7ea7\u5206\u7c7b\u6240\u5728\u7684li \u5217\u8868\u7684\u80cc\u666f\u8272*/
.skin-box-bd .menu-list .menu-selected .link{background:#000000;}
/*\u4e00\u7ea7\u5206\u7c7b\u6240\u5728\u7684li \u5217\u8868\u7684\u6587\u5b57\u80cc\u666f\u8272*/
.skin-box-bd .menu-list .menu-selected .link .title{background:#000000;}
\u4fee\u6539\u4e00\u7ea7\u5206\u7c7b\u7684\u5bbd\u5ea6\uff1a
.menu-list .menu{background:#\u989c\u8272;margin:0;padding:0px \u589e\u52a0\u7684\u5bbd\u5ea6px;}
\u9f20\u6807\u6ed1\u8fc7\u4e00\u7ea7\u5206\u7c7b\u5bfc\u822a\u6587\u5b57\u53d8\u6362\u80cc\u666f\u8272\u4ee3\u7801\u5982\u4e0b\uff1a
.menu-list .menu-hover .link{background:#000000;}
\u9f20\u6807\u6ed1\u8fc7\u4e00\u7ea7\u5206\u7c7b\u5bfc\u822a\u6587\u5b57\u53d8\u6362\u989c\u8272\u4ee3\u7801\u5982\u4e0b\uff1a
.menu-list .menu-hover .link .title{color:#FFFFFF;}
---------------------------------------------------------------------------------
\u8bbe\u7f6e\u4e8c\u7ea7\u5206\u7c7b\u7684\u6837\u5f0f
\u4e8c\u7ea7\u5206\u7c7b\u6587\u5b57\u4ee3\u7801\u5982\u4e0b\uff1a
.popup-content .cats-tree .fst-cat .cat-name{font-size:\u5b57\u53f7px;color:#\u989c\u8272\u4ee3\u7801;font-weight:bold/bolder/normal;}
\u4e8c\u7ea7\u5206\u7c7b\u80cc\u666f\u4ee3\u7801\u5982\u4e0b\uff1a
.popup-content{background:#000000;}
\u9f20\u6807\u6ed1\u8fc7\u4e8c\u7ea7\u5206\u7c7b\u5bfc\u822a\u6587\u5b57\u53d8\u6362\u80cc\u666f\u8272\u4ee3\u7801\u5982\u4e0b\uff1a
.popup-content .cats-tree .cat-hd-hover{background:#000000;}
\u9f20\u6807\u6ed1\u8fc7\u4e8c\u7ea7\u5206\u7c7b\u5bfc\u822a\u6587\u5b57\u53d8\u6362\u989c\u8272\u4ee3\u7801\u5982\u4e0b\uff1a
.skin-box-bd .popup-content .cats-tree .cat-hd-hover .cat-name{color:#ff0000;}
\u4fee\u6539\u4e8c\u7ea7\u5206\u7c7b\u7684\u9ad8\u5ea6\uff1a
.popup-content .cats-tree{margin:0 0 50px 0;}
\u4fee\u6539\u4e8c\u7ea7\u5206\u7c7b\u53f3\u4fa7\u56fe\u6807\u4ee3\u7801\u5982\u4e0b\uff08\u6709\u4e09\u7ea7\u5206\u7c7b\u624d\u4f1a\u663e\u793a\uff09\uff1a
.popup-content .cats-tree .fst-cat-icon{background:url(\u56fe\u7247\u8fde\u63a5);}
----------------------------------------------------------------------------------
\u8bbe\u7f6e\u4e09\u7ea7\u5206\u7c7b\u7684\u6837\u5f0f
\u4e09\u7ea7\u5206\u7c7b\u6587\u5b57\u4ee3\u7801\uff08\u9664\u53bb\u201c\u6240\u6709\u5b9d\u8d1d\u201d\u5206\u7c7b\uff09\u5982\u4e0b
.popup-content .cats-tree .snd-pop-inner{font-size:\u5b57\u53f7px;color:#\u989c\u8272\u4ee3\u7801;font-weight:bold/bolder/normal;}
\u4e09\u7ea7\u5206\u7c7b\u6587\u5b57\u4ee3\u7801\uff08\u5305\u62ec\u201c\u6240\u6709\u5b9d\u8d1d\u201d\u5206\u7c7b\u5b57\u4f53\u5927\u5c0f\uff09\u8fd9\u6837\u5c31\u65e0\u6cd5\u6539\u53d8\u5b57\u4f53\u989c\u8272\uff0c\u6211\u4eec\u4f1a\u7ee7\u7eed\u5b8c\u5584\u8be5\u4ee3\u7801\uff01\u5982\u4e0b
.popup-content .cats-tree .snd-pop-inner{font-size:\u5b57\u53f7px;color:#\u989c\u8272;}
\u4e09\u7ea7\u5206\u7c7b\u80cc\u666f\u4ee3\u7801\uff1a
.popup-content .cats-tree .snd-pop-inner{background:#000000;}
\u9f20\u6807\u6ed1\u8fc7\u4e09\u7ea7\u5206\u7c7b\u5bfc\u822a\u6587\u5b57\u53d8\u6362\u80cc\u666f\u8272\u4ee3\u7801\u5982\u4e0b\uff1a
.popup-content .cats-tree .snd-cat-hd-hover{background:#000000;}
\u5728\u4e09\u7ea7\u5206\u7c7b\u524d\u52a0\u4e0a\u5c0f\u5757\u767d\u8272\u4ee3\u7801\u5982\u4e0b\uff1a
.popup-content .cats-tree .snd-cat-icon{display:block;height:3px;width:3px;}
绛旓細.popup-content .cats-tree .snd-pop-inner{background:#000000;} 榧犳爣婊戣繃涓夌骇鍒嗙被瀵艰埅鏂囧瓧鍙樻崲鑳屾櫙鑹浠ｇ爜濡備笅锛.popup-content .cats-tree .snd-cat-hd-hover{background:#000000;} 鍦ㄤ笁绾у垎绫诲墠鍔犱笂灏忓潡鐧借壊浠ｇ爜濡備笅锛.popup-content .cats-tree .snd-cat-icon{display:block;height:3px;width:3...
绛旓細鍏朵腑锛000000鏄唬琛ㄩ粦鑹茬殑鍗佸叚杩涘埗棰滆壊浠ｇ爜锛14px鏄唬琛ㄥ瓧浣撳ぇ灏忕殑鍍忕礌鍊硷紝Arial,sans-serif鏄唬琛ㄥ瓧浣撴牱寮忕殑鍊銆傚崠瀹跺彲浠ユ牴鎹嚜宸辩殑闇瑕侊紝鑷畾涔夊簵閾哄瓧浣撻鑹层佸ぇ灏忓拰鏍峰紡銆傛敼鍙樺簵閾哄鑸爮 搴楅摵瀵艰埅鏍忔槸搴楅摵鐨勯噸瑕佺粍鎴愰儴鍒嗭紝瀹冨彲浠ヨ鐢ㄦ埛鏇村姞鏂逛究鍦版祻瑙堝簵閾恒備互涓嬫槸涓浜涘父鐢ㄧ殑搴楅摵瀵艰埅鏍忎唬鐮侊細```/*鏀瑰彉瀵艰埅...
绛旓細1锛氱櫥闄嗘窐瀹濆崠瀹朵腑蹇冿紝杩涘叆娣樺疂搴楅摵瑁呬慨鍚庡彴椤甸潰锛岄紶鏍囨斁鍦ㄥ鑸爮浣嶇疆锛屽嚭鐜扮紪杈戠獥鍙锛2锛氱偣鍑荤紪杈戯紝鎵惧埌鈥滄樉绀鸿缃濓紝鐐瑰嚮鍚庣湅鍒扮櫧妗嗗氨鏄疌SS鑷畾涔夋銆3:灏嗘垜浠笂闈㈡彁渚涚殑閫忔槑浠ｇ爜澶嶅埗杩涘幓锛屽鑸爮灏变細閫忔槑鏄剧ず浜 绠鍗曠殑娣樺疂鏂版椇閾鸿嚜瀹氫箟CSS瀵艰埅閫忔槑鑳屾櫙浠ｇ爜锛.skin-box-bd{background:none;} .menu-list...
绛旓細棣栧厛鏄css锛歛{ color: #000000} a:hover {color: #fff; background: #000; }鐒跺悗a鏍囩 鐐瑰嚮鎸夐挳杩欎簺鏄痑鏍囩鐨勪竴浜涙牱寮 a 鏍囩瀵规槸涓涓綉绔欑殑涓鏉′俊鎭摼鎺ュ畾涔夌殑锛宎:link {} /* 鏈闂殑閾炬帴 */a:visited {} /* 宸茶闂殑閾炬帴 */a:hover {} /* 褰撴湁榧犳爣鎮仠鍦ㄩ摼鎺ヤ笂 */a...
绛旓細border:none;}.all-cats .link:hover{background:#FFFFFF;}.all-cats .link .title{color:#000000;border:none;}.all-cats .link .title:hover{color:#000000;}.skin-box-bd .menu-list .menu .link:hover{background:#FFFFFF;}.skin-box-bd .menu-list .menu .link .title{background:...
绛旓細鍔犵殑鏂规硶濡備笅锛氳缃枃妗ｅご鑳屾櫙鍥剧墖锛 鑳屾櫙鍥剧墖鐨勬渶涓婃柟锛 鍋氬嚭1PX鎴2PX鐨勮摑鑹茬嚎鏉★紝 娣樺疂瑁呬慨鍚庡彴锛岃缃按骞冲钩閾恒傚湪澶撮儴璁剧疆DIV鐨勪笂杈规锛屾垜鐨勮繖涓摑绾挎槸2PX锛岄珮搴︿负120PX銆傚叿浣CSS浠ｇ爜涓鸿繖閲岄潰鏄叿浣撶殑浠ｇ爜锛屾垨鑰呮枃瀛椼
绛旓細绗竴姝ワ紝杩涘叆搴楅摵瑁呬慨鐐圭紪杈戯細绗簩姝ワ紝鐐规樉绀鸿缃細绗笁姝ワ紝灏嗘樉绀浠ｇ爜鏀捐繘鍘伙紝杩欎釜鏄垜浠洟闃熺殑浠ｇ爜锛氱鍥涳紝渚濇偍鐨勮儗鏅鑹插拰鏂囨湰鍙樼矖锛屼唬鐮佸涓嬶細.all-cats .link{background:none repeat scroll 0 0 #FF0000;}.skin-box-bd .all-cats .title{font-size:12px;font-weight:bold;color:#000000...
绛旓細V1.00 缁胯壊鐗堝姛鑳界畝浠嬭繖涓緢澶氫汉杩樹笉鐭ラ亾,鐜板湪璁╂垜浠竴璧锋潵鐪嬬湅鍚э紒缃戦挍娣樺疂搴楅摵瀵艰埅CSS浠ｇ爜鐢熸垚鏄负娣樺疂鐢ㄦ埛绮惧績鎵撻犵殑涓娆娣樺疂瀵艰埅浠ｇ爜鐢熸垚鍣紝杩欐杞欢浣跨敤闈炲父绠鍗曪紝瀹屽叏鍌荤摐寮忔搷浣滐紝鍙渶鎵嬪姩鐐瑰嚮鍜岃緭鍏ユ枃瀛楀嵆鍙揩閫熷埗浣滃嚭瀵艰埅鏉鏁堟灉浠ュ強浠ｇ爜锛岃兘澶熶负娣樺疂鍗栧鍜岀編宸ヨ妭绾﹀ぇ閲忕殑宸ヤ綔閲忋
绛旓細 .box{background-color:#C9CEC8;width:420px;height:50px;margin:0 auto;border-top:2px solid #353736;} .content{height:32px;background-color:606F76;border:1px solid #7697AA;} .content span{margin-right:18px;} .normal{color:white;float:left;display:block;line-height:30px...
绛旓細浠ｇ爜锛<!DOCTYPE html> CSS3 澶氳竟褰.pxsbx{ width: 100px; height: 60px; -webkit-transform: skew(-20deg); -moz-transform: skew(-20deg); -o-transform: skew(-20deg); background: #669;margin-left:20px; }
