Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New to the CF scene
    Join Date
    Dec 2007
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Hovering the color over the block

    Hi, I am a new to web designing I am still in the learning process. In this Adobe site http://www.adobe.com/ how do they manage to hover the color (in this respect black) in the top navigation bar.Could anybody tell me the CSS code for it.It would be very helpful for me, thanks in advance.

  • #2
    Regular Coder
    Join Date
    Aug 2005
    Posts
    364
    Thanks
    7
    Thanked 1 Time in 1 Post
    If you simply wanna give your links the hover effect like the Adobe's menu, you can use the below code...
    Code:
    A{display:block;padding:4px;font-weight:bold;text-decoration:none;line-height:20px;}
    A:hover{display:block;padding:4px;text-decoration:underline;line-height:20px;background-color:#000;}
    Hopefully this will help you understanding the basic code for making a block hyper link.
    For more tutorials regarding the CSS/HTML learning, visit http://www.w3schools.com

  • #3
    The Apostate Apostropartheid's Avatar
    Join Date
    Oct 2007
    Posts
    3,215
    Thanks
    16
    Thanked 265 Times in 263 Posts
    Or, in a slightly more readable format:
    Code:
    a {
        display: block;
        padding: 0 1em;
        font-weight: bold;
        text-decoration: none;
        line-height: 2.2;
        color: black;
    }
    a:hover { 
        background: black;
        text-decoration: underline;
        color: white;
    }
    Last edited by Apostropartheid; 12-11-2007 at 04:39 PM.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •