How to place images on your page
So, have you been wondering how to add an image to your page? Well, let's take a look at the image tag:
<img src="image.gif" />
The img stands for image. The src stands for source. The source of the image is going to be the Web address of the image. Most often, you will be able to just type the filename of the image here, like this:
<img src="image.gif" />
The filename does not have to end with .gif. You could also use a .jpg file as well. These are two of the most common image file extensions used on the Internet. If you have images in other file formats, you will probably want to convert them to .gif or .jpg . This can be done with most image editing programs. A commonly used program is Paint Shop Pro, which is available as shareware from JASC.
Now, if your images are in a directory other than the one your HTML document is in, you will want to link to it using the full address of the image. So, if your image is located at http://www.disney.com/pictures/image.jpg, you would use this url as the image source:
<img src="http://www.disney.com/pictures/image.jpg" />
If you aren't sure, go ahead and use the full address just to be sure it will work correctly. Now let's work with a real example. One image I have on this site is called "next.jpg". The address for the image is: http://www.pageresource.com/images/next.jpg. If my image and HTML file were in the same directory, I would type:
<img src="next.jpg" />
Otherwise, I would use the full Internet address, like this:
<img src="http://www.pageresource.com/images/next.jpg" />
Either option would display the image on the page, aligned to the left, like this:
If you want to center the image on the page, you would place the center tag around the image tag, like this:
<center><img src="http://www.pageresource.com/images/next.jpg" /></center>
This will place the image in the center of the screen:
Keep in mind, the filename or address of the image IS case sensitive, so "image.jpg" and "IMAGE.JPG" are considered two different images to the Web browser. Be sure to use the correct case in your image tags, or the image may not show up, and that's no fun.
Now, this doesn't give us everything we could possibly want, but it will allow you to add an image to your page on its own line. If you want to see more on using images, check out one of these related tutorials:
Aligning Images and Wrapping TextUsing an Image as a LinkUsing a Background ImageResizing an ImageUsing Image "alt" Attributes
If you would like to move on, let's go to the next section, Some More Text Tags.
<img src="image.gif" />
The img stands for image. The src stands for source. The source of the image is going to be the Web address of the image. Most often, you will be able to just type the filename of the image here, like this:
<img src="image.gif" />
The filename does not have to end with .gif. You could also use a .jpg file as well. These are two of the most common image file extensions used on the Internet. If you have images in other file formats, you will probably want to convert them to .gif or .jpg . This can be done with most image editing programs. A commonly used program is Paint Shop Pro, which is available as shareware from JASC.
Now, if your images are in a directory other than the one your HTML document is in, you will want to link to it using the full address of the image. So, if your image is located at http://www.disney.com/pictures/image.jpg, you would use this url as the image source:
<img src="http://www.disney.com/pictures/image.jpg" />
If you aren't sure, go ahead and use the full address just to be sure it will work correctly. Now let's work with a real example. One image I have on this site is called "next.jpg". The address for the image is: http://www.pageresource.com/images/next.jpg. If my image and HTML file were in the same directory, I would type:
<img src="next.jpg" />
Otherwise, I would use the full Internet address, like this:
<img src="http://www.pageresource.com/images/next.jpg" />
Either option would display the image on the page, aligned to the left, like this:
If you want to center the image on the page, you would place the center tag around the image tag, like this:
<center><img src="http://www.pageresource.com/images/next.jpg" /></center>
This will place the image in the center of the screen:
Keep in mind, the filename or address of the image IS case sensitive, so "image.jpg" and "IMAGE.JPG" are considered two different images to the Web browser. Be sure to use the correct case in your image tags, or the image may not show up, and that's no fun.
Now, this doesn't give us everything we could possibly want, but it will allow you to add an image to your page on its own line. If you want to see more on using images, check out one of these related tutorials:
Aligning Images and Wrapping TextUsing an Image as a LinkUsing a Background ImageResizing an ImageUsing Image "alt" Attributes
If you would like to move on, let's go to the next section, Some More Text Tags.
www.pagesource.com
0 komentar:
Post a Comment