日期:2014-05-17  浏览次数:20470 次

问个简单的问题 献丑鸟- -哈哈

 <td valign="top" class="FolderToolbarContainer" style="overflow: auto; width: 100%;
  background: #fff;">
  <asp:Panel runat="server" ID="PanelCatalog" Style="font-size: 9pt">
  <span runat="server" style="text-align: center; vertical-align: middle;">
  <p title="收藏的知识">
  <img src="/Document/Public/Images/ModuleIcons/Recommend.gif" />
  收藏的知识:
  </p>
  </span><span runat="server" style="text-align: center; vertical-align: middle;">
  <p title="推荐的知识">
  <img src="/Document/Public/Images/ModuleIcons/SignItem.gif" />
  推荐的知识:
  </p>
  </span><span runat="server" style="text-align: center; vertical-align: middle;">
  <p title="知识学习">
  <img src="../../Public/Images/ModuleIcons/StudyItem.gif" />
  知识学习:
  </p>
  </span><span runat="server" style="text-align: center; vertical-align: middle;">
  <p title="我创建的知识">
  <img src="../../Public/Images/ModuleIcons/MyKnowledge.gif" />
  我创建的知识:
  </p>
  </span>
  </asp:Panel>
  </td>


P标签用的很少 我想实现的效果是 p标签如何实现像a标签一样鼠标移上去变色 点击选中变色 还有P标签是否可以点击时候传ID?

------解决方案--------------------
jquery 轻松实现
HTML code

<!DOCTYPE html>
<html>
<head>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
    <style type="text/css">
        .hover{background:#00F;}
        .click{background:#F00;}
    </style>
   <script type="text/javascript">
      $(function(){
            $("p").hover(function(){
                    $(this).addClass("hover");                      
            },function(){
                $(this).removeClass("hover");
            }).click(function(){
                $(this).toggleClass("click");    
            })
            
            
     })
  </script>
</head>
<body>
   <p title="收藏的知识">
  <img src="/Document/Public/Images/ModuleIcons/Recommend.gif" />
  收藏的知识:
  </p>
  </span><span runat="server" style="text-align: center; vertical-align: middle;">
  <p title="推荐的知识">
  <img src="/Document/Public/Images/ModuleIcons/SignItem.gif" />
  推荐的知识:
  </p>
  </span><span runat="server" style="text-align: center; vertical-align: middle;">
  <p title="知识学习">
  <img src="../../Public/Images/ModuleIcons/StudyItem.gif" />
  知识学习:
  </p>
  </span><span runat="server" style="text-align: center; vertical-align: middle;">
  <p title="我创建的知识">
  <img src="../../Public/Images/ModuleIcons/MyKnowledge.gif" />