How to Use Images in HTML PDF Print E-mail
Written by Anthony Delgado   

Rating 10.0/10 (1 vote)

Use Images in HTML 

Introduction

Learn to add pictures into HTML code.

Instructions

Difficulty: Moderately Easy

Steps

1

Step One

Add picture: (Blue) "img src" defines the image source. In the quotes you put the web path to the image. If you do not put a path, but just put the file name, it will look in the same directory as the html file only. You can use a slash to identify a sub-directory that exists in the same directory as the html file as seen in the example.
2

Step Two

Size: (Orange) width and height are used to change the size of the picture in pixels. It is always best to change it proportionally to the original file. For example, if the picture is 800x600, you can change it to 400x300 and it will look the same, just smaller. If you make it 400x400, it will be stretched widthwise.
3

Step Three

Alternate Text: "alt" is used to specify alternate text. This text will appear if for some reason the image file is not accessible.
4

Step Four

Buttons: (Green) A button is just a picture that has a hyperlink referenced to it so that when you click on the picture, you are redirected to the URL. Use the "a href" function as shown in the example.
Look at this article for more details.
http://www.ehow.com/how_2102636_write-html-hyperlink.html
5

Step Five

Background: (Red) The background is one of the options in the body command. A background is specified by "body background" and the referencing the location of the picture to be used just like with other pictures.




Reddit!Del.icio.us!Facebook!Slashdot!Netscape!Technorati!StumbleUpon!Newsvine!Furl!Yahoo!Ma.gnolia!Free social bookmarking plugins and extensions for Joomla! websites!
Comments
Add NewSearch
Only registered users can write comments!

Copyright (C) 2007 Alain Georgette / Copyright (C) 2006 Frantisek Hliva. All rights reserved.

 
< Prev   Next >