выделить пункты меню - PullRequest
Новая
       3

выделить пункты меню

2 голосов
/ 22 февраля 2012

Я пытаюсь выделить следующее меню 

<ul class="listing">
<li><a href="Review.html">Review</a></li>
<li><a href="Preview.html">Preview</a></li>
<li><a href="Images.html">Images</a></li>
<li><a href="Videos">Videos</a></li>
</ul>

И CSS 

 .listing li{display: inline;
            text-decoration: none}

ul.listing a{font-size: 15px;
              text-align: justify;
              text-decoration: none}

ul.listing a:hover{box-shadow: inset 0px 12px 15px -2px gray }




ul.listing{margin-left: 150px;
           padding: 5px;    
           background: ;
           box-shadow: inset 0px -20px -2px -16px #812;
           width: 940px;
           height:  25px;
           margin-top: 100px;
       }

Как мне это сделать?

Ответы [ 3 ]

1 голос
/ 24 февраля 2012

Попробуйте это,

Ваши коды верны, единственная проблема состояла в том, что вы забыли добавить точку до определения класса в css. Я исправил это. теперь ваш код работает. 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title><br />
<style type="text/css">

.listing{margin-left: 150px;
           padding: 5px;    
           background: ;
           box-shadow: inset 0px -20px -2px -16px #812;
           width: 940px;
           height:  25px;
           margin-top: 100px;
       }
 .listing li{display: inline;
            text-decoration: none}

.listing a{font-size: 15px;
              text-align: justify;
              text-decoration: none}

.listing a:hover{box-shadow: inset 0px 12px 15px -2px gray }





}
</style>
</head>

<body>

<ul class="listing">
<li ><a href="Review.html">Review</a></li>
<li><a href="Preview.html">Preview</a></li>
<li><a href="Images.html">Images</a></li>
<li><a href="Videos">Videos</a></li>
</ul>


</body>
</html>
1 голос
/ 22 февраля 2012

Что вы подразумеваете под подсветкой? Похоже, вы могли бы сделать это, добавив div, окружающий ваш ul, и выделив ему выделенный цвет фона. 

#nameOfDiv{
    background-color: #FFFF00;
}

Также, как сказал Билли Мун, вам нужно исправить свои теги.

0 голосов
/ 22 февраля 2012

просто используйте равную js функцию, чтобы получить имя файла из URL , чтобы получить имя URL.затем:

если вы указали в var filename свое имя файла, тогда просто выполните следующее: 

$("#listing a[href="+filename+"]").addClass("highlightclass");

это добавит класс к ссылке с указанным href к highlightclass

...