Scribd Logo
Загрузить

Добро пожаловать в Scribd!

  • Chapter5: Images: Inserting Images in HTML Page

    Загружено:

    Mohamud
    18 просмотров3 страницы
    lesson5

    Оригинальное название

    Chapter 5

    Авторское право

    © © All Rights Reserved

    Доступные форматы

    DOCX, PDF, TXT или читайте онлайн в Scribd

    Этот документ был вам полезен?

    Это неприемлемый материал?

    Пожаловаться на этот документ
    lesson5

    Авторское право:

    © All Rights Reserved
    Скачайте в формате DOCX, PDF, TXT или читайте онлайн в Scribd
    Отметить как неприемлемый контент
    18 просмотров3 страницы

    Chapter5: Images: Inserting Images in HTML Page

    Загружено:

    Mohamud
    lesson5

    Авторское право:

    © All Rights Reserved
    Скачайте в формате DOCX, PDF, TXT или читайте онлайн в Scribd
    Отметить как неприемлемый контент
    из 3

    CHAPTER5: IMAGES

    Inserting images in HTML page


    A picture is worth a thousand words, compared to text, images enable you to present your ideas
    in a better way. They also add aesthetic value apage . you can add images to HTML page to
    either improve its appearance or present important information. For example you can add graphs
    or charts as images to HTML page. To add images to HTML page ,you can use several image
    formats, these formats include gif and jpeg. In this chapter, you will learn how to use the various
    tags to add images to HTML page.
    The <BODY>tag: the BACKGROUND attribute
    You can use the BACKGROUND attribute of the <BODY> tag to add an image as a background
    in HTML page. The following is the syntax for the BACKGROUND attribute:
    < BODY BACKGROUND = image file name> text body </body>
    In the preceding code, you need to specify the name of an image file as the value of the
    BACKGROUND attribute. In addition, if the image file is not in the same directory as the
    HTML page, you need to provide the complete path to the image file along with its complete
    name in the BACKGROUND attribute.
    Usually, the background image in HTML files moves along with the text. However, you can
    choose to have the background image static with respect to the text. You can do this by using the
    BGPROPERTIES attribute of the <BODY> tag.
    The following is the syntax of the BGPROPERTIES attribute:
    < BODY BACKGROUND = image file name BGPROPERTIES = FIXED> text body
    </body>
    In the preceding syntax , the value fixed for the BGPROPERTIES attribute implies that the
    background image must be static with respect to the text. However, if you require an image that
    moves along with the text, you need not provide this attribute in the <BODY> tag.

    The IMAGE element


    You use the image element in HTML page to add images along with text. An image added by
    using the image element, unlike the background image occupies space within the HTML page.
    To add the image to HTML page , you use the <IMG> tag. The following is the syntax of the
    <IMG> tag.
    <IMG SRC = name of the image file >
    In the preceding syntax , the SRC attribute of the<IMG> tag is used to specify the name of the
    image file, if the image file is located in directory that is different from the directory where the
    HTML page is located, you must specify the complete path to the file. When using the
    <IMG>tag it is mandatory to specify a value for the SRC attribute.
    In addition to the SRC attribute, the <IMG> tag has several other attributes these include:

    Width
    Height
    Hspace
    Vspace
    Align
    Alt

    The WIDTH and HEIGHT attribute


    You use the WIDTH attribute to specify the horizontal area that an image will cover in HTML
    page. Similarly, the HEIGHT attribute is used to specify the vertical area that an image will
    cover in HTML page. The values of these attributes can be different from the actual dimensions
    of the image.
    If you dont specify these attributes, the browser determines the actual dimensions of the image
    before displaying it.
    Consider the following code example:<IMG SRC=img2.gif width=100 height= 150>
    The HSPACE and VSPACE attributes

    You use the HSPACE and VSPACE

    attributes to specify horizontal and vertical margins

    respectively for an image, these margins specify the distance of an image from the text appearing
    around the image.
    The following is the syntax for the HSPACE and VSPACE attributes:<IMG SRC=img2.gif HSPACE=20 VSPACE=20>
    The ALIGN attribute
    You use this attribute to specify the vertical alignment of an image. The following is the syntax
    of the ALIGN attribute:<IMG SRC=img2.gifALIGN=value>
    The ALIGN attribute can take several values. The commonly used values include:

    Left: you specify this value to align the image to the left.
    Right: you specify this value to align the image to the right.
    Top: you specify this value to align the image to the top.
    Middle: you specify this value to align the image to the middle of the page.

    The ALT attribute


    Usually, all browsers support images, however, there might be some Character User Interface
    (CUI) based browsers that do not display the images used with in HTML page . in such browsers
    you can display alternate text in place of the image. To do this, you use the ALT attribute of the
    <IMG> tag.
    The following is the syntax for the ALT attribute:
    <IMGSRC=file nameALT=alternate text>

    Вам также может понравиться