Skip to main content

Adding images HTML - Using <img/> tag

Images are embedded or included in an HTML document using an <img src=""/> tag. To add an image just insert this line of code in your document.
HTML
<img src="html5.png" alt="html5 logo"/>
Here as you can see we used the src attribute to give the link(path) of image file.

The attribute alt contains text which is shown when image gets problem in loading or somehow browser is unable to find the image. The alt="" attribute should contain text value which describes the image. For examlle the following image is the logo of HTML5 hence the alt attribute is set to html5 logo. For example I have set a wrong path to image (html5.png) which is a false location, hence the alt text is being shown down here
HTML5 Logo
You can customize the size of image using width and height attribute.
HTML
<img src="html5.png" alt="html5 logo" width="300" height="300"/>
This will resize the image and will show
html5 logo
You may add title attribute and must use alt attribute for SEO (Search engine optimization) purpose.

Comments

Post a Comment

Popular posts from this blog

CSS animations , flying rocket and rotating cube.

Learning CSS ANIMATIONS CSS animations are great and always been attractive for everyone. Today here I am gonna teach you the animation in which a font-awesome rocket is flying between the clouds and also a 3D rotating cube with perspective. The rocket animation is 2D and made with the help of font-awesome and css transform property. You can download the source file of flying rocket by Here  . For the full tutorial Go to  Rocket animation css tutorial  . Download the source file of rotating cube by  Here  . For full tutorial go to  to this link  .
Post a Comment
Read more

AJAX - Asynchronous JavaScript and XML

AJAX tutorial AJAX is a developer's dream, because you can:  Update a web page without reloading the page Request data from a server - after the page has loaded Receive data from a server - after the page has loaded Send data to a server - in the background What is AJAX? AJAX = Asynchronous JavaScript And XML.  AJAX is not a programming language.  AJAX just uses a combination of:   A browser built-in XMLHttpRequest object (to request data from a web server) JavaScript and HTML DOM (to display or use the data)  AJAX applications might use XML, plain text or JSON text to transport data. AJAX allows web pages to be updated asynchronously by exchanging data with a web server behind the scenes. This means that it is possible to update parts of a web page, without reloading the whole page. How ajax works 1. An event occurs in a web page (the page is loaded, a button is clicked) 2. An XMLHttpRequest object is created by JavaScript 3. The XMLHttpRequest object sends
1 comment
Read more

Basic CSS , Introduction to properties

CSS is a stylesheet language which runs in users browser to give a rich and decorative user-experience.Currently the latest version available of CSS is 3 and CSS4 is going to arrive with many new features. CSS3 brought many new features like Animations , transforms etc. Today here we are gonna cover all the basic properties used in CSS , which you are gonna use most of the time. The colors supported in CSS can be written in the form of hsba() or hsb() or rgb() or rgba() or hexadecimal or in color names. Color Opacity Background Border Box-shadow Height and Width Position Margins and paddings Display Text-Align Font Properties : Color The color property sets color of the text inside the selector. CSS p { color : red ; } //produces Hello world! CSS p { color : rgb ( 38 , 98 , 67 ) ; } //produces Hello world! Opacity The color property sets opacity of any selected element. It varies from 0 (invisbile) to 1(fully visbile) CSS p {
Post a Comment
Read more