HTML

HTML : Hyper Text Markup Language

<html>        </html> —— Tells about Coding Language. HTML5.

<head>        </head>—— Gives info to Browser.

<body>       </body>——Contains everything that is displayed on a webpage.

Structure of Coding:

<Opening tag or Markup  Attribute=”Attribute Value”> Plain Text(content)</closing tags>

ex: <h1> This is Heading </h1>

Attributes:  defines properties for the content. Syntax: Attribute=”Attribute Value”.

ex: <p lang=”en”> A paragraph in English </p>

Always save a html file as index.html.

There are two types of Markups. Structural and Symantec.

Structural markups are which gives structure to the element in between the tags. Symantec markups are which gives specific style to the element in between the opening and closing tags.

Structural Markups:

<sub>   </sub>

<sup>   </sup>

<br/>

<hr/>

Symantec Markups:

<strong> </strong> ——–gives boldness to text

<em>  </em> ———-empahsizes the text

<blockquote> </blockquote>

<q>  </q> ——–gives ” ”

<abbr title=”attribute value”> </abbr>———gives abbrevation

<cite> </cite>

<dfn> </dfn>

<address> </address>

Markups to make changes to the content:

<ins> </ins> insert

<del> </del> delete

<s> </s> strike

Listing Items:

Ordered list <ol> </ol>, unordered list<ul> </ul>

definition list

ex:

<dl>

<dt> HTML </dt>

<dd> Hyper Text Markup Language </dd>

</dl>

Nested Listing is also done.

Links And Images

Links are of two types:

Relative Links: Within page or site

Absolute Links: starts in new tab

anchor tag: <a> This is Anchor tag </a>

ex: <a href=”https://www.google.com”&gt; Google </a>

Syntax for image:

<img src=”file folder\filename.jpg” alt=”description” title=”roll over description”/>

Other Attributes for Image: width=” x px” height=”y px”

Tables:

<table>

<tr>

<th> Heading</th>

<td> data </td>

</tr>

</table>

Attribute:

Colspan = “no.” —data occupies no. of cells column wise.

rowspan=”no.”—data occupies no. of cells row wise.

Grouping Tables:

<thead> </thead>

<tbody> </tbody>

<tfoot> </tfoot>

Attributes: border =”no. of pixels”

background-color=” ”

cell-padding=” ”

cell-spacing=” ”

Forms:

search bar, sign in are some examples of forms. Forms are used to get or post info.

syntax:

<input type=” ” name=” ” size=” ” maxlength=” ” palceholder= ” ” >

<textarea> this is for Comment box</textarea>

Radio Button: type=”radio”

checkbox: type=”checkbox”

Dropdown Box:

<select name= ” ” >

<option value=” “>   </option>

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s