codehub27: January 2023

HTML Tutorial - Tags part 1

Tag is a signal to web browser for displaying contents. It has two types.

· Standalone tags
· Container tags

HTML has wide range of tags with different purpose. Based on location of the usage , tags are divided into many categories. They are listed below…

Tags used in Document head
Tags used in Document body
Tags used in Forms
Tags used in table

Here, a detailed explanation of each tags with some examples shown below...

1.Tags used in Document head

As everybody knows,Document head is the beginning part of HTML file.

It includes base information, heading,title of the page, document meta,information, type of scripting language used in the file,cascading style sheet information and so on…

Each tag has served for unique purpose. It has different attributes too.

i) <BASE>

It is a standalone tag in which the user can establish a base URL in a document. It has an attribute called HREF.

ii) <HEAD>

This is a container tag denotes the start of the document head.

Syntax:

<!DOCTYPE HTML>

<HTML>

<HEAD>

Elements…..

</HEAD>

…………

</HTML>

iii) <LINK>

If you want to link a page from the your current page, this stand alone tag is used.

It has many attributes.

HREF- URL of the document to be linked

NAME- Defines the name of the URL

METHODS- List of functions supported by current document

REL- Defines the relationship between the current document and the document linked

REV- Defines the reverse relationship between these two documents

TITLE- provides the title of linked document

URN- Uniform Resource Number

The example which shows a GM Biography is shown below….

<HEAD>

<TITLE> Export corporation limited </TITLE>

</HEAD>

iv) <META>

This stand alone tag provides the document meta information. It specifies the content, HTTP equivalent and the piece of meta information.

Eg:

v) <SCRIPT>

This container tag shows the information about the scripting languages used.

Eg:

..............

</SCRIPT>

These are the tags used in document head.

HTML Tutorial - How to create HTML file in text editor???

Do you want to create a website with many web pages???

Do you look for a language for creating a website??

If your answer is “yes”, let us start to use this language “HTML”.

What is HTML?.

HTML is expanded as Hyper Text Markup Language used to create webpages and websites.

It has many elements which makes the browser to display the content.

HTML: how it comes…

Initially, HTML was derived from SGML (Standard Generalized Markup Language). After HTML, it was HTML+. Next versions of HTML are HTML 2, HTML 3, HTML 4 and HTML5. Current version is HTML 5.

HTML has a structure with many elements with attributes, character and entity references. The structure is given below.

<!DOCTYPE html>

<html>

<head> A sample for HTML </head>

<body>

<p>Welcome to the world of HTML</p>

</body>

</html>

Where,

<> symbol is used to represent elements.

<html>, <head>, <body> are opening tags

</html>, </head>, </body> are closing tags

DOCTYPE defines the type of document. Here, the document type is html.

How to create HTML file in text editor???

Simple steps are given below.

Just open a text editor like notepad.
Type the above code and save the file with .html extension.
Open the file in the web browser.
Finally, the web browser displays your contents.

The above file gives you a simple output

A sample for HTM

Welcome to the world of HTML

You can use any text editor instead of notepad.

C Programs to practice - File handling

File is a collection of records. In c,we have a set file related operation. First, use an inbuilt structure "FILE" for accessing file related operations.

Next, create a file pointer for this structure "FILE". Further,use the following syntax to open a file.

filepointer= fopen("filename","mode");

where

filename is the file in which you are going to process.

mode refers the operation.

"r"-Read the file.

"w"- Write the content to the file.

"a" -Read and write purpose.

Once the file is opened, write the contents to the test file until the last character by using a condition strlen(data)<0 followed by fputs() function.

When the condition fails,the control come out of the loop. Now, the program is finished.

Now, you can open the test file manually and check the content. The data you have written in the test file is shown.

The sample program is shown below.

"Filehandle.c"

#include <stdio.h>

#include <string.h>

void main()

{

FILE *ft;

char data[50]=”Hello world, This is a sample program”;

ft=fopen(“test.c”,”w”);

if(ft==NULL)

{

printf(“test file fails to open”);

}

else

{

printf(“The file is opening”);

if (strlen(data)>0)

{

fputs(data,ft);

fputs(“\n”,ft);

}

fclose(ft);

printf(“The file is written in file”);

getch();

}

The output is

Output screen of the "Filehandle.c"

The file is opening

The file is written in file

"test.c"

Hello world, This is a sample program.

Thus the way, we created file handling program in c.

C Programs to practice - Display vehicle information using Structure

Structures are used to create user defined data structures. It contains variables with different data types combined together.

It has a basic syntax given below...

struct structure_name

{

datatype variablename1;

datatype variablename2;

.......

datatype variable name n;

};

Next, create the variable for the structure that declared already.

Syntax for creating structure variable is given below...

struct structure_name variable_name;

using the above syntax,we can create 'n' number of structure variables. After the declaration of structure variable,you can get the input or assign the values for structures.

An example with describes the structure which displays vehicle details is given below...

#include<stdio.h>

struct vehicle {

char type[50];

char company[50];

char model[50];

};

void main()

{

struct vehicle v1={“Motor bike”,”RoyalEnfield”,”Hunter”};

struct vehicle v2={ “Car”,”Maruthi”,”Swift”};

struct vehicle v3={“Scooty”,”Tvs”,”zest”};

printf(“ Type: %s Company: %s Model :%s”, v1.type,v1.company,v1.model);

printf(“ Type: %s Company: %s Model :%s”, v2.type,v2.company,v2.model);

printf(“ Type: %s Company: %s Model :%s”, v3.type,v3.company,v3.model);

getch();

}

The output is given below..

Type : Motcomor bike Company : RoyalEnfield Model :Hunter

Type : Car Company :Maruthi Model :Swift

Type: Scooty Company:Tvs Model : zest

These are the way to create and access structure and its variable. You can create any structures like payslip of an employee by using structures.

C programs to practice : basic calculator using switch case

Switch case is used to select the operations from many statements. Here, a simple calculation program is given below.

First, get the operation to performed.

Next, get the two inputs.

Based on the inputs, perform the operation and display the results.

Now ,the program begins….

“calculate.c”

#include<stdio.h>

#include<conio.h>

void main()

{

char operation,

double a,b;

printf(“Enter the operation: +, - , /, * , % ”);

scanf(“%c”,&operation);

printf(“Enter the numbers”);

scanf(“ %lf %lf”, &a,&b);

switch(operation)

{

case ‘+’ :

printf(“ %.1lf + %.1lf : %.1lf”, a,b,a+b);

break;

case ‘-’ :

printf(“ %.1lf - %.1lf : %.1lf”, a,b,a-b);

break;

case ‘/’ :

printf(“ %.1lf / %.1lf : %.1lf”, a,b,a/b);

break;

case ‘*’ :

printf(“ %.1lf * %.1lf : %.1lf”, a,b,a*b);

break;

case ‘%’ :

printf(“ %.1lf + %.1lf : %.1lf”, a,b,a%b);

break;

default:

printf(“error, The operator is not correct”);

break;

}

getch();

}

The output will be like as follows…

Enter the operation: +, - , /, * , % +

Enter the numbers 3 4

3.0 + 4.0 = 7.0