We can see the HTML of any page using CTRL+U (Windows) and Option+U(Mac).
The basic elements of an HTML page are:
- A text header, denoted using the
<h1>,<h2>,<h3>,<h4>,<h5>,<h6>tags. - A paragraph, denoted using the
<p>tag. - A horizontal ruler, denoted using the
<hr>tag. - A link, denoted using the
<a>(anchor) tag. - A list, denoted using the
<ul>(unordered list),<ol>(ordered list) and<li>(list element) tags. - An image, denoted using the
<img>tag - A divider, denoted using the
<div>tag - A text span, denoted using the
<span>tag
The next few pages will give an overview of these basic HTML elements.
Each element can also have attributes - each element has a different set of attributes relevant to the element. There are a few global elements, the most common of them are:
id- Denotes the unique ID of an element in a page. Used for locating elements by using links, JavaScript, and more.class- Denotes the CSS class of an element. Explained in the CSS Basics tutorial.style- Denotes the CSS styles to apply to an element. Explained in the CSS Basics tutorial.data-xattributes - A general prefix for attributes that store raw information for programmatic purposes. Explained in detailed in the Data Attributes section.
HTML code for inserting images
Basic HTML
<img src="URL of image" />
With descriptive text
<img src=”URL of image” alt=”alternate text” title=”infotip text” />
<img src=”URL of image” alt=”alternate text” title=”infotip text” height=”preferred height” width=”preferred width” />
HTML Links - Hyperlinks
HTML links are hyperlinks.
You can click on a link and jump to another document.
When you move the mouse over a link, the mouse arrow will turn into a little hand.
Note: A link does not have to be text. It can be an image or any other HTML element.
<a href="url">link text</a>
HTML <video>
The
controls attribute adds video controls, like play, pause, and volume.
It is a good idea to always include
width and height attributes. If height and width are not set, the page might flicker while the video loads.
The
<source> element allows you to specify alternative video files which the browser may choose from. The browser will use the first recognized format.
The text between the
<video> and </video> tags will only be displayed in browsers that do not support the <video> element.
.png "English"){kind=small}
