Copyright © tutorialspoint.com

# WML - Images

The <img> element is used to include an image in a WAP card. WAP-enabled wireless devices only supported the Wireless Bitmap (WBMP) image format.

WBMP images can only contain two colors: black and white. The file extension of WBMP is ".wbmp" and the MIME type of WBMP is "image/vnd.wap.wbmp".

The <img> element supports the following attributes:

Attribute | Value | Description
--- | --- | ---
align |

- top
- middle
- bottom

Alignment the image
alt | alternative text | Sets an alternate text to be displayed if the image is not displayed.
height |

- px
- %

Height of the image in poixels or percentage. If you specify the value in pixels, the syntax is "140", instead of "140px".
hspace |

- px
- %

Sets white space to the left and right of the image. If you specify the value in pixels, the syntax is "140", instead of "140px".
localsrc | cdata | Sets an alternate representation for the image. If this attribute is set, the browser will use it instead of the "src" attribute.
src | image url | A path to wbmp image.
vspace |

- px
- %

Sets white space above and below the image. If you specify the value in pixels, the syntax is "140", instead of "140px".
width |

- px
- %

Sets the width of the image.If you specify the value in pixels, the syntax is "140", instead of "140px".
xml:lang | language_code | Sets the language used in the element
class | class data | Sets a class name for the element.
id | element ID | A unique ID for the element.

# How to Make ".wbmp" Images

There are free tools available on the Internet to make ".wbmp" images.

The Nokia Mobile Internet Toolkit (NMIT) comes with a WBMP image editor that you can use. You can convert existing GIF or JPG image files into WBMP file using NMIT.

Another free tool is ImageMagick, which can help you to create WBMP images.

Following is the example showing usage of <img> element.

    <?xml version="1.0"?>
    <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.2//EN"
    "http://www.wapforum.org/DTD/wml12.dtd">

    <wml>

    <card title="WML Images">
    <p>
    This is Thumb image
    <img src="/images/thumb.wbmp" alt="Thumb Image"/>
    </p>

    <p>
    This is Heart image
    <img src="/images/heart.wbmp" alt="Heart Image"/>
    </p>

    </card>

    </wml>

This will produce following result:

Copyright © tutorialspoint.com