320 likes | 484 Views
What is HTML. HTML is a simple scripting language used to create Hypertext Documents. Hypertext is simply a piece of text that works as a link. Markup Language is a way of writing layout information with documents. Tools needed for HTML. Window operating system.
E N D
What is HTML HTML is a simple scripting language used to create Hypertext Documents. Hypertext is simply a piece of text that works as a link. Markup Language is a way of writing layout information with documents.
Tools needed for HTML • Window operating system. • Browser software. ( Internet, opera, Netscape, navigator etc.) • For editing HTML text notepad is needed.
step for creating and displaying web page. • Do al the HTML coding in notepad. • Save the file with extension HTML. • Open the browser software ( Internet explore, opera etc).
Rules of HTML document s. • The element one closed in tag. • HTML has begging and ending tag. • The begging HTML element is closed by using slash.
the Head section • the HEAD section comes between a <head> and </head> tag. it contains information about document about document as a whole like title script, style definition, document description .
the Title tag • the text written between <title> and </title> tag is used to set title of the browser window.
the body section • the text written inside the <body> and </body> tag is displayed in webpage. • <html><head><title> dang</title></head> <body> cypress computer center Tulsipur dand Nepal. E-mail : cypress computer @yahoo. COM web site : www. cypress computer .com. </body></html> note :- type above HTML codes using any one text editor like Notepad, Edit pad and save with Htm. or HTML extension. Run this file using any one internet Browser like internet Explorer, Netscape, opera, etc.
BG color (Background color). • This attribute specifies the background color of the webpage. This can be specified in two ways. • First Way is to use on of the pre defined color name, blue, gray, green, red, silver, white yellow etc. Example:- <html><head><title> Dang </title></head> <body bgcolor=“red”> Cypress Computer institute. Tulsipur dang. </body></html>
Second way is to specify the color by RGB format. RGB stands for Red- Green- Blue. The number specify with Bgcolor attribute has six digits i.e. RRGGBB (Two digits for red, two digits for green, two digits for blue). The number specify are in hexadecimal number system. If you don’t know about hexadecimal number system you can refer the given table. The base of hexadecimal is 16. The minimum Hexadecimal number can be 00 and maximum can be FF. if value specified is “FF0000” then 100% of Red, 0% of green and 0% of blue. For black :- “00 00 00” . For white :- “FF FF FF”. 2. Second way
Example. • <html> • <head> • <title> Bhupendra</title></head> • <body bgcolor=“00ff00”> in the early days of web page design, the code used to create web pages (HTML) was input manually. It is time consuming business to create complicated WebPages. </body></html>
Background (Image as a background) • The background attribute specifies an image file, which is used as a background picture. • <html> <head> <title> dang </title> </head> <body background=“C:\Backup\Photo\Sinri\BIRDS\02.jpg”> Cypress Computer center. Tulsipur dang. </body></html>
Text • This attribute specify the color of text relation in web page. <html> <head> <title> <body bgcolor=“green” text=“blue”> This attribute specify the color of the text. </body> </html>
The <BR>Tag • The BR tag is used to brake line. <html> <head> <title> Cypress computer center. </title> </head> <body bgcolor=“123256” text=“green”> Depending on the device used, system architecture, <BR>processing mode and language used in the computer are categorized in the following five generation. </body> </html>
The <PRE> tag • The pre tag is used to set the pre define format text and style. <html> <head><title> dang</title></head> <body bgcolor=“green” text=“red”> <pre> Student of Cypress computer center. • Binod OLI. • Sandip Thapa • Tika dangi. • Khim K.c. </body></html>
The <heading> tag • Heading are used to display some important information on the web. There are six different levels for heading (H1…H6). • <html> <head><title>Dang</title></head> <body bgcolor=“green” text=“white”> <h1> Cypress computer</h1> <h2> Dang Nepal</h2> </body></html>
The < block quote> tag • This tag is used to format is a spar ale paragraph and more of the browser display it indented. • <html><head><title> Rolpa</title></head> <body bgcolor=“45689” text=“green”> <block quote> Depending on the device used, system architecture, processing mode and language used in the computer are categorized in the following five generation. The development of different types of memory device has given a sequence of development of computer from mainframe to microcomputers. In the development of computer there is lot of change from 1946 to 1990. this time is divided in different generation by scientists in a conference in 1962. </block quote> </body></html>
The <Center> tag • This tag is used to center align the required text, heading, images and tables. This tag breaks the line automatically. • <html><head> • <title> Nepal • </title></head> <body> <center> <h1> Welcome to cypress center.</h1> </center> </body></html>
The <BDO> tag • This tag overrides the default text direction and language. Dir attributes are used to change the text direction. • <html><head><title> Cypress.</title></head> <body> <center><BDO dir=“rtl”/ “ltr”><h1> AMBULANCE </CENTER> </BDO> </BODY></HTML>
<BR >Tag • This tag is used to break the line. • <html><head><title> dang </title></head> <body bg color=“green” text =“white”> Depending on the device used, system architecture, processing mode and language used in the computer are categorized in the following five generation .<br> . The development of different types of memory device has given a sequence of development of computer from mainframe to microcomputers. In the development of computer there is lot </body></html>
<pre> tag • This tag is used to set preformatted text and style. • <html><head><title>Cypress .</title</head> <body><pre> <h1> student of cypress</h1> • binod. • Jeeven. • Deepk. </body></html>
The <p> tag • This tag is used to define alignment of paragraph. The value are left, center, right and justify. • <html><head><title>Cypress</title></head>. <body bgcolor=“green” text=“red’> <p align =“left”> . The development of different types of memory device has given a sequence of development of computer from mainframe to microcomputers. In the development of computer there is lot .</p> </body></html>
The <font> tag • The font tag is used to define different types of font, font size and font color for the web. • 1- size :- this attribute sets the size of the font. The font size can be set from 1 to 7. • 2- face :- this attribute define the font face. • 3- color :- this attribute define the font color of the text.
Example • <html><head><title> dang</title></head> <body bgcolor=“green” text=“white”> <h1> cypress computer center.</h> <font face =“preeti” size =“5” color=“red”> <pre> • Nepal . • India. • China. • Japan. </font></body></html>
the <image> tag • this tag is used to insert an image in the document. it doesn't have ending tag but have different attributes for setting title, source, size, alignments, horizontal and vertical spaces, borders etc. • SRC :- this attribute defines the name and path (location) of the image. • size (width and Height) :- this attribute defines size of an image in pixels. • Align :- this attribute specifies the position of an image. • H space and V space :- these are used to give required space from left and top edge of the document window. • Alt :- this attribute is used to define some comments for image with the mouse pointer.
example • <Html><head><title> Nepal </title></head> <body > <image src =" c:\backup\photo\bhupendra\10.jpg" height =100 width=100 alt ="welcome to you"> </body></html>
<html> <body><form> • <center> <h1> BIODATA </CENTER></H1> • <P ALIGN="RIGHT"> • <IMAGE SRC="C:\BACKUP\photo\PHOTO\Photo\Copy of HEmraj\photos\86.JPG" HEIGHT="200" WIDTH="200"></P> • NAME: <INPUT TYPE="TEXT" NAME="NAME" SIZE="30"><BR> <BR> • ADDRESS: <INPUT TYPE="TEXT" NAME="ADDRESS" SIZE="30"> <BR> <BR> • PASSWORD <INPUT TYPE="PASSWORD" NAME="PASSWORD" SIZE="30" MAXIMUM LENGTH="8"><BR><BR> • GENDER:<BR> • <INPUT TYPE="CHECKBOX" NAME="GENDER" VALUE="MALE"> MALE. • <INPUT TYPE="CHECKBOX" VALUE="FEMALE"> FEMALE.<BR> <BR> • MARRIAGE:<BR> <INPUT TYPE="CHECKBOX" NAME="MARRIED" VALUE="MARRIED"> MARRIED. • <INPUT TYPE="CHECKBOX" NAME="MARRIED" VALUE="UNMARRIED"> UNMARRIED.<BR> <BR> • EDUCATION<BR><INPUT TYPE="CHECKBOX" NAME="EDUCATION" VALUE="S.L.C"> S.LC. • <INPUT TYPE="CHECKBOX" NAME="EDUCATION" VALUE="I.A"> I.A • <INPUT TYPE="CHECKBOX" NAME="EDUCATION" VALUE="B.A" >B.A • <INPUT TYPE="CHECKBOX" NAME="EDUCATION" VALUE="M.A" > M.A • <INPUT TYPE="CHECKBOX" NAME"EDUCATION" VALUE=" PHD" > PHD<BR><BR> • OCCUPATION<BR> <INPUT TYPE="CHECKBOX" NAME="OCCUPATION" VALUE="TEACHER"> TEACHER. • <INPUT TYPE="CHECKBOX" NAME="OCCUPATION" VALUE="FARMER"> FARMER. • <INPUT TYPE="CHECKBOX" NAME="OCCUPATION" VALUE="BUSSINESSMAN"> BUSSINESSMAN. • <INPUT TYPE="CHECKBOX" NAME="OCCUPATION" VALUE="DRIVER"> DRIVER. • <INPUT TYPE="CHECKBOX" NAME="OCCUPATION" VALUE="ELECTRICIAN"> ELECTRICIAN.<BR> • <BR>SALARY<BR><INPUT TYPE="CHECKBOX" NAME="SALARY" VALUE="Rs.5,000.">Rs.5,000. • <INPUT TYPE="CHECKBOX" NAME="SALARY" VALUE=" Rs.8,000."> Rs.8,000. • <INPUT TYPE="CHECKBOX" NAME="SALARY" VALUE="Rs.10,000."> Rs.10,000.<BR> • <BR>CONTACT PHN<BR> • <INPUT TYPE="CHECKBOX" NAME="CONTACT PHN" VALUE="TELPHONE 082-520654"> TELEPHONE.082-520654.<BR • <INPUT TYPE="CHECKBOX" NAME="CONTACT PHN" VALUE="MOBILE 98578520765"> MOBILE 98578520765.<BR> • <BR><INPUT TYPE="RESET" VALUE="CLEAR"> <BR> • <INPUT TYPE="SUBMIT" VALUE="SENT"> • </FORM> </BODY> </HTML>
Select the text. <HTML><HEAD><TITLE>DANG. </TITLE> </HEAD> <BODY BGCOLOR="GREEN" TEXT="BLUE"> <FORM> NAME OF COUNTRY <SELECT NAME="COUNTRY"> <OPTION ="NEPAL"> NEPAL <OPTION ="INDIA"> INDIA <OPTION ="CHINA"> CHINA <OPTION ="BHUTAN"> BHUTAN <OPTION ="AMERICA"> AMERICA <OPTION ="DENMARK"> DENMARK <OPTION VALUE="NEPAL" SELECTED>NEPAL </SELECT> <TEXT AREA="COLUMN" ROWS="3" COLS="5"> CYPRESS COMPUTER CENTER TULSIPUR DANG. PHONE NUMBER 082-522004 E-MAIL CYPRESS COMPUTER CENTER @YAHOO.COM </TEXTAREA> </FORM> </BODY> </HTML>