div+css处理链接的 link visited hover active四种状态

分享一下我老师大神的人工智能教程。零基础!通俗易懂!风趣幽默!还带黄段子!希望你也加入到我们人工智能的队伍中来!https://blog.csdn.net/jiangjunshow

               

   div+css处理链接的:link,:visited,:hover,:active四种状态

   [示例代码]

   <html>
       <head>
           <style>
               a:link {background-color: red; color: white;}
               a:visited {background-color: yellow; color: black;}
               a:hover  {background-color: green; color: white;}
               a:active {background-color: blue; color: white;}
           </style>
       </head>
       <body>
           <div>
               <a href="http://a.link/">
                   链接的默认效果是a:link中的效果
               </a>
           </div>
           <div>
               <a href="">
                   访问过的链接的效果是a:visited中的效果
               </a>
           </div>
           <div>
               <a href="http://blog.csdn.net/hu_zhenghui">
                   鼠标移动到链接上的效果是a:hover中的效果
               </a>
           </div>
           <div>
               <a href="http://blog.csdn.net/hu_zhenghui">
                   鼠标单击链接时的效果是a:active中的效果
               </a>
           </div>
       </body>
   </html>

   [div+css关键词]

div css

   [div+css重要工具]

   Internet Explorer Developer Toolbar, http://www.microsoft.com/downloads/details.aspx?FamilyID=e59c3964-672d-4511-bb3e-2d5e1db91038&amp;displaylang=en

   [div+css的常见问题]

较验div+css格式, http://validator.w3.org/
div+css的margin缩写方式
div+css的padding缩写方式
链接的:link,:visited,:hover,:active四种状态

   [div+css的浏览器兼容问题]

水平居中,Firefox使用margin-left: auto; margin-right: auto; IE6 使用text-align: center;
垂直居中,Firefox中使用display: table-cell; vertical-align: middle;可以实现div垂直居中,而IE6中则需要借助IE6中css的特点实现垂直居中。
!important标记,Firefox支持!important标记,IE6忽略!important标记
手形鼠标指针,使用cursor: pointer;           

分享一下我老师大神的人工智能教程。零基础!通俗易懂!风趣幽默!还带黄段子!希望你也加入到我们人工智能的队伍中来!https://blog.csdn.net/jiangjunshow

猜你喜欢

转载自blog.csdn.net/gdfjhc/article/details/87894764