Home > PHP > Course > Basics of HTML

HTML is Hyper Text Markup Language used to create web pages. This is have set of tags. Each HTML tag describes different document content. In the earlier post learned about Open Source, now learn about HTML( Lesson from PHP online course ). HTML is a Markup code that is very popular because it is one of the most commonly used on the Internet at the moment. It can be read by most modern web browsers and is the preferred for web pages. They like the idea of people using just HTML and having any other programming codes placed off the page.

Basics of HTML

Basics of HTML by Anil Kumar Panigrahi

Here is a basic tags of HTML.

<!DOCTYPE html>
<title>This is sample HTML file</title>
    <h1>This sample Heading by Anil Labs</h1>
    <p>This is first paragraph by Anil Labs</p>
    <p>This is sample <b>HTML</b> page</p>

In this DOCTYPE – declares the document type
HTML starting with <html> and ending with </html>
<head> and </head> is the header of page
Title for the HTML page will be under <title> and </title>
Main HTML page content will be in <body> and </body>
Page Heading will be in heading tags i.e. h1,h2,h3,h4,h5,h6
Paragraphs in <p> and </p>

Some more tags will used in HTML pages

<h1>,<h2>,<h3> to <h6> : Heading tags
<p></p> : Paragraph tag
<b></b> : Bold tag
<i></i> : Italic tag
<ul></ul> : Unorder list tag
<ol></ol> : Order list tag
<li></li> : List item tag
<br> : Break tag
<hr> : Horizontal rule or thematic break
<div></div> : division tag that set of documents in one block
<select></select> : select tag for list of options in drop down box
<input> : Input tag for input box
<form></form> : Form tag for dynamic pages ( to store data into server or get from there )
<table></table> : Table tag for display tables in page
<th></th> : Table header tag
<tr></tr> : Table row tag
<td></td> : Table data tag
<font></font> : Add fonts to block of contents

Calling/Add styles for HTML page

Under header block (<head> ,</head>) call the external styles by below format

<link rel="stylesheet" href="style.css" type="text/css">

or internal styles

<style type="text/css">

call this style in HTML element by

<p class="pageStyle">This is simple style</p>.

Calling/Add scripts for HTML page

Under header block (<head> ,</head>) call the external scripts by below format

<script type='text/javascript' src='//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js'></script>

or internal scripts

<script type='text/javascript'>
    function pageFunction(){
        alert("This is simple script function");

call this function in HTML element by

<input type="button" value="Click Me!" onClick="pageFunction();" />

This post contains small descriptions and small examples.