-->

  • HTML Images with width and height

    HTMl Images





    HTML Images 

    Pictures that say thousands of words that describe your website  :-  Kumar Atul Jaiswal
    Kumar Atul Jaiswal


     HTML Images Syntax
    In HTML, images are defined with the <img> tag.
    The <img> tag is empty, it contains attributes only, and does not have a closing tag.

    The src attribute specifies the URL (web address) of the image:

    <img src="url">


    The Alt Attribute  
    The alt attribute provides an alternate text for an image, if the user for some reason cannot view it (because of slow connection, an error in the src attribute, or if the user uses a screen reader).

    The value of the alt attribute should describe the image:
    Example
    <!DOCTYPE html>
    <html>
    <body>

     <h2>The alternative Text.</h2>

     <p>The alt attribute provides an alternate text for an image, if the user for some reason cannot view it (because of slow connection, an error in the src attribute, or if the user uses a screen reader). The value of the alt attribute should describe the image.</p>
    <img src="atul.png" alt="MyImage">

     </body>
    </html>

    result:
    MyImage

      If a browser cannot find an image, it will display the value of the alt attribute.






    Note: The alt attribute is required. A web page will not validate correctly without it.

    Image Size : Width and Height







    You can use the style Attribute to specify the width and height of  an Page.
    -------------------------------------------------------------------------------------------------------------------

     Example :

     <!DOCTYPE html>
    <html>
    <body>

     <h2>The alternative Text.</h2>

     <p>The alt attribute provides an alternate text for an image, if the user for some reason cannot view it (because of slow connection, an error in the src attribute, or if the user uses a screen reader). The value of the alt attribute should describe the image.</p>
    <img src="atul.png" alt="MyImage" style="width:500px;height:600px;">

     </body>
    </html>
    -------------------------------------------------------------------------------------------------------------------



    Alternatively, you can use the width and height attributes:
    ------------------------------------------------------------------------------------
    Example :

    <!DOCTYPE html>
    <html>
    <body>

     <h2>The alternative Text.</h2>

     <p>The alt attribute provides an alternate text for an image, if the user for some reason cannot view it (because of slow connection, an error in the src attribute, or if the user uses a screen reader). The value of the alt attribute should describe the image.</p>
    <img src="atul.png" alt="MyImage" width="500" height="600">

     </body>
    </html>

    -------------------------------------------------------------------------------------------------------------------

    The width and height attributes always defines the width and height of the image in pixels.


    NOTE : Always specify the width and height of an Image.If width and Height are not specrified, the page might flicker while the image loads.




    For More Information To watch This Video 




                

    • 0 comments:

    Post a Comment

    For Any Tech Updates, Hacking News, Internet, Computer, Technology and related to IT Field Articles Follow Our Blog.