仿126邮箱标签
欢迎各位多批评指正，以能够完善
演示
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><html> <head> <title> New Document </title> <meta name="Generator" content="EditPlus"> <meta name="Author" content=""> <meta name="Keywords" content=""> <meta name="Description" content=""> <script type="text/javascript"> var isIE = (document.all) ? true : false; var isIE6 = isIE && ([/MSIE (\d)\.0/i.exec(navigator.userAgent)][0][1] == 6); var $ = function (id) { return "string" == typeof id ? document.getElementById(id) : id; }; var Class = { create: function() { return function() { this.Init.apply(this, arguments); } } } var Extend = function(destination, source) { for (var property in source) { destination[property] = source[property]; } } var Bind = function(object, fun) { var args = Array.prototype.slice.call(arguments,2); return function() { return fun.apply(object, args); } } var BindAsEventListener = function(object, fun) { var args = Array.prototype.slice.call(arguments,2); return function(event) { return fun.apply(object, [event || window.event].concat(args)); } } var CurrentStyle = function(element){ return element.currentStyle || document.defaultView.getComputedStyle(element, null); } function addEventHandler(oTarget, sEventType, fnHandler) { if (oTarget.addEventListener) { oTarget.addEventListener(sEventType, fnHandler, false); } else if (oTarget.attachEvent) { oTarget.attachEvent("on" + sEventType, fnHandler); } else { oTarget["on" + sEventType] = fnHandler; } }; function removeEventHandler(oTarget, sEventType, fnHandler) { if (oTarget.removeEventListener) { oTarget.removeEventListener(sEventType, fnHandler, false); } else if (oTarget.detachEvent) { oTarget.detachEvent("on" + sEventType, fnHandler); } else { oTarget["on" + sEventType] = null; } }; </script> <style type="text/css"> a{ underline:none; } #header{ background-image: url('http://mimg.126.net/p/dm3style/lib/1001261008/share_blue/f2.gif'); background-repeat: repeat-x; background-position: 0px 0px; position: relative; width:800px; height:63px; } #menu{ white-space:nowrap; height:28px; width:700px; position:absolute; bottom: 6px; left: 50px; overflow:hidden; white-space:nowrap; } #menu div{ float: left; clear: right; cursor: pointer; } #menu div table{ border: 0px; padding: 0px; margin: 0px; } #menu div table td{ height: 30px; text-align: left; vertical-align: bottom; padding-top: 2px; line-height : 28px; } .AtdL{ width:5px; background-image: url('http://mimg.126.net/p/dm3style/lib/1001261008/share_blue/f1.gif'); background-repeat: no-repeat; background-position: -457px -58px; } .AtdM{ background-image: url('http://mimg.126.net/p/dm3style/lib/1001261008/share_blue/f2.gif'); background-repeat: repeat-x; background-position: 0px -181px; font-family: 宋体; font-size: 13px; font-weight: bold; color: #FFFFFF; } .AtdR{ width: 5px; background-image: url('http://mimg.126.net/p/dm3style/lib/1001261008/share_blue/f1.gif'); background-repeat: no-repeat; background-position: -471px -58px; } .ItdL{ width:6px; background-image: url('http://mimg.126.net/p/dm3style/lib/1001261008/share_blue/f1.gif'); background-repeat: no-repeat; background-position: -456px -16px; } .ItdM{ background-image: url('http://mimg.126.net/p/dm3style/lib/1001261008/share_blue/f2.gif'); background-repeat: repeat-x; background-position: 0px -139px; font-family: 宋体; font-size: 13px; font-weight: bold; color: #669EBA; } .ItdR{ width: 7px; background-image: url('http://mimg.126.net/p/dm3style/lib/1001261008/share_blue/f1.gif'); background-repeat: no-repeat; background-position: -471px -16px; } #menu table td a { display: block; height: 15px; width: 15px; padding-bottom: 3px; } .AtdM a{ background-image: url('http://mimg.126.net/p/dm3style/lib/1001261008/share_blue/f3.gif'); background-repeat: no-repeat; background-position: -159px -100px; } .AtdM a:hover{ background-position: -159px -142px; } .ItdM a{ background-image: url('http://mimg.126.net/p/dm3style/lib/1001261008/share_blue/f3.gif'); background-repeat: no-repeat; background-position: -181px -180px; } .ItdM a:hover { background-position: -159px -180px; } .closeall{ margin-top:5px; } .closeall a{ background-image: url('http://mimg.126.net/p/dm3style/lib/1001261008/share_blue/f1.gif'); background-repeat: no-repeat; background-position: -0px -227px; display: block; height: 21px; width: 25px; } .closeall a:hover{ background-position: -32px -227px; } </style> <!--[if IE]> <style type="text/css"> #menu { bottom: 5px; } </style> <![endif]-->