Yahoo Answers is shutting down on May 4th, 2021 (Eastern Time) and beginning April 20th, 2021 (Eastern Time) the Yahoo Answers website will be in read-only mode. There will be no changes to other Yahoo properties or services, or your Yahoo account. You can find more information about the Yahoo Answers shutdown and how to download your data on this help page.

How to apply a CSS image to a website?

Right, so, I'm making a design for my own website. I decided to make a hover bar, which requires CSS coding so that when you hover over one of the buttons, it lights up. I also need to embed links into this image. Problem is, I have no idea how to upload the image and still have the CSS working. I also have a tidbit of HTML code that goes with it.

Any suggestions? I'm new to this.

2 Answers

Relevance
  • 9 years ago
    Favorite Answer

    If I understand this correctly...you want to hover over an image and have it light up as you do so? I'm guessing that would be a drop shadow effect, unless you just want roll-over images (Google it).

    CSS Code:

    #navbutton {

    width:specify;

    height:specify;

    }

    #navbutton:hover {

    -moz-box-shadow: 3px 3px 4px #000;

    -webkit-box-shadow: 3px 3px 4px #000;

    box-shadow: 3px 3px 4px #000;

    margin-bottom:10px;

    }

    HTML Code:

    <img src="" id="navbutton" />

    Specify just means specify what goes there. Also, the color of the hover effect you can change to whatver you want just by deleting the '#000' and typing '#', then picking a color. The 'margin-bottom' just makes it pop upwards a little (not needed). As for uploading the image, it's different for each server provider, so I can't help you there.

    Email me for any help: fletchernick2@gmail.com

  • ?
    Lv 4
    5 years ago

    Let's make this useful: typically use HTML/CSS. one million. It is convenient to seem unprofessional while utilizing snap shots, for my part. You particularly have to use a few sort of exchanging the photograph while the mouse is hovered over it, which might result in difficulty two. two. Even if each and every photograph if an excessively small measurement (might be a kilobyte), except the consumer is utilizing pipelining (not really), each and every photograph is one other, unmarried server request. Each request has a prolong. When exchanging snap shots (on hover, for instance), except you preload each and every photograph even earlier than the person has clicked on it (preload utilizing a CSS hack or JavaScript), then the person will enjoy a brief prolong earlier than the photograph is downloaded and rendered, which could be very unprofessional. three. It's further server bandwidth for your self. It's no longer one hundred% feasible to duplicate all matters utilizing CSS, however in case you cannot do your menu with out it, you could have overcomplicated your layout. If you are certain that it does no longer seem unprofessional and you do not brain the person having a prolong then opt for snap shots. But preclude in any respect charges if feasible. The huge majority of adequately designed and widespread websites will use HTML/CSS. Images are a historic, dangerous addiction that used to be fortunately dropped while CSS utilization grew to become extra widespread. TL;DR? Best train is to make use of HTML/CSS.

Still have questions? Get your answers by asking now.