Build Web Site Free | Adding a regular image

Adding a Regular Image to Your Web Page

:: "Adding regular images to your pages is very simple...just follow along ..."

This example below will allow you to add an image to a specific page. The banner example had us placing the the image code in a "global style sheet" which forces the image to display on each page. The example below will have you place images inside specific pages - only appearing on the page where you palce the code.

So... lets place an image - a 200w graphic on your home page. We set no height on the image - however our style sheet will display all images at 200 pixels wide with the code we are about to use.

You'll need to create your own with the above dimensions and name it img-200.jpg; save it to your web folder.

Step 1. Open index.asp

  • Navigate to C\:your-folder-name\index.asp
  • Right mouse click on the file - open it with notepad
  • scroll down the page and locate any paragraph tags:
  • <p></p>

Step 2. Add image code

  • Directly after the first open paragraph tag, <p>
  • Paste this line of code:
  • <img class="imgleft" src="img-200.jpg" alt="my-image"/>
  • Make sure the code is placed right after the <p> tag but before your paragraph text.
  • Save index.asp to your web folder with your new changes

top

Step 3. Upload - image and style sheets

  • Upload the two edited files to your web host
  • Upload index.asp to your web host
  • Upload img-200.jpg to your web host

Repeat this process for any images you want to add to your web page. We are limited at this point to 200 pixel wide and left side placement with respect to the paragraph text. Get used to this common image layout first before moving to advanced image layout.

Here's what your finished page should look like: Web page with image example

top