How to Add an Image to a CSS File


CSS, or Cascading Style Sheet, is often used to define the style of a website. Within the CSS code contains a site's layout, font styles and color themes. One other common use of CSS is defining the background image within the site. A background image defined in CSS can be used for the design of a site theme, or it can also be used to allow for text to be placed on top of an image such as in banner headers.

  • Open your CSS file in Notepad.

  • Add the following CSS code:


      background-image: URL(image/yourimage.gif);


    Replace "image/yourimage.gif" with the path name where your image file is located.

  • Use the CSS in your HTML by specifying the "header" as the class. For example:

    <div class="header">Header content here</div>

Related Searches


  • Photo Credit Hemera Technologies/ Images
Promoted By Zergnet


Related Searches

Check It Out

Geek Vs Geek: Robot battles, hoverboard drag race, and more

Is DIY in your DNA? Become part of our maker community.
Submit Your Work!