CSS:将这些导航 "picture"/logo 链接变成普通的 html 链接

Question

请参阅http://jeaffreygilbert.com/workatplayheader.html

和接受的问题答案CSS: How to make this topheader?

如您所见，所有链接(服务、工具箱等，包括 work[at]play Logo + 联系我们)都在此处:

_{(来源:workatplay.com)}

我希望有正常的 html 链接.. 所以我有正常的服务。它与 sprite-nav.png 有任何关系。

Answer 1

那些已经是 HMTL 链接，只是用列表包裹起来。您只需修改 CSS。

我为你做了，你可以用这个替换旧样式:

CSS:

/* Resetter */
ol, ul, li, a {
    background: transparent;
    border: 0px;
    font-size: 100%;
    margin: 0px;
    outline: 0px;
    padding: 0px;
    vertical-align: baseline;
}
ul, li {
    list-style-type: none;
}

/* Body */
body {
    background-image: url(http://www.workatplay.com/sites/all/themes/play/css/schemes/pink/bg-home.png);
    font:13px Verdana;
}

/* Header */
.header {
    margin: 0px auto;
    position: relative;
    width: 1000px;
}
.header ul li {
    float: left;
}
.header ul li a {
    background-position: 0% 0%;
    background-repeat: no-repeat;
    cursor: pointer;
    display: block;
    color:white;
    text-decoration:none;
    padding:10px;
}
.header ul li:hover {
    background:red;
}

/* Nav */
ul#nav {
    height: 80px;
    margin-top: 80px;
    -webkit-padding-start: 10px;
    display: block;
}
ul#nav li.home {
    float: right;
}

/* Sub Nav */
ul#nav-sub {
    background: transparent url(http://www.workatplay.com/sites/all/themes/play/css/schemes/pink/sprite-nav.png) no-repeat scroll 0px -160px;
}
ul#nav-sub {
    background-position: 0px -160px;
    background-repeat: no-repeat;
    height: 40px;
}
ul#nav-sub li {
    margin-top:10px;
}
ul#nav-sub li.contact {
    float: right;
}