Language) What is HTML? • HyperText Markup Language, the coding language used to create hypertext documents for the World Wide Web. In HTML, a block of text can be surrounded with tags that indicate how it should appear (for example, in bold face or italics). Also, in HTML a word, a block of text, or an image can be linked to another file on the Web. HTML files are viewed with a World Wide Web browser. What is an HTML File?
• An HTML file is a text file containing
small markup tags • The markup tags tell the Web browser how to display the page • An HTML file must have an htm or html file extension • An HTML file can be created using a simple text editor Basic HTML Tags • Tag Description • <html> Defines an HTML document • <title> Defines title of your web page • <body> Defines the document's body • <h1> to <h6> Defines header 1 to header 6 <p> Defines a paragraph • <br> Inserts a single line break • <hr> Defines a horizontal rule • <!--> Defines a comment Example
• <html> <title> SCS ,DAVV ,Indore </title> <h1> Welcome to SCS DAVV</h1> <body> The different course run at SCS are <br> <b>M.Tech.(CS)<br>M.Sc. (IT/CS)<br>MCA<br>MBA(CM) </b> </body> </html> HTML tags Cont…
• <tt> Renders as teletype or mono
spaced text • <i> Renders as italic text • <b> Renders as bold text • <big> Renders as bigger text • <small> Renders as smaller text HTML tags Cont… • Body tag Attributes <BGCOLOR> changes the background color of body. The color name is equivalent to hexadecimal no. <BACKGROUND> Specifies the background of document. <TEXT> changes the body text color. HTML tags Cont… • Types of lists. Unordered list(Bullets) Unordered list starts with <ul> and ends with </ul> tag. Each list item starts with <li> tag. Eg. <ul type=square> <li> M.Tech(cs) <li> M.Sc(it/cs) <li> MBA(cm) </ul> HTML tags Cont… • Ordered list (numbering). This list starts with <ol> and ends with </ol> tag. Each list item start with <li> tag. And type used to controls the numbering scheme to be used. For eg. Type=“1” will give counting numbers(1,2,……) Type=“A” will give Upper case letter(A,B,……) <ol type=“1” start=5> <li>India <li>America <li>china </ol> HTML tags Cont… • Definition list This list is used to define a term start with <dl> and ends with </dl>. It have two parts (i) definition term and (ii) definition description. <dl> <dt> SCS <dd> School of Computer Science <dt> SoEx <dd>School of Electronics. HTML tags Cont… • Table tag and its attributes. All table related tags are included in between <table> and </table>. Each row starts with <tr> and </tr> and each column starts with <td> and </td>. HTML tags Cont… • Graphics in html document. HTML mainly accepts two types of file format .jpg and .gif . The image can inserted into document using <IMG> tag. <img width=500 height=28 src=“d:\chetan\p1.jpg> Linking Documents • HTML allows linking to other HTML documents or images. Clicking on text or image will open an entire web page or an image. The text or image that provide such links is called Hyperlink, Hypertext or Hotspot. • Browser distinguishes Hyperlinks from normal text by…. • Each hyperlink appears blue in color • The hyperlink text/image is underlined. • When mouse cursor placed over it, mouse shape changes to shape of hand. Linking Documents Cont……. • Links are created by using <A> and </A> tags. Anything written in between this tags becomes hyperlink. • By using HREF attribute of <A> tag the document to navigate must be specifed. Ex. <A HREF=“filename.html”> Frames • Frames divides the browser screen into two or more HTML recognizable unique regions using <frameset> and </frameset> tags. Each region is known as frame. • The frameset tag requires following two attributes, for screen has to be divided into rows or columns. • Rows- This attribute is used to divide screen into multiple rows. It can be set equal to a list of values. The values can be: – A no. of pixel – Expressed as percentage of screen resolution. – The symbol *, which indicates the remaining space. Frames tag cont……… • Cols:---- This divides the screen into multiple columns. • Ex. <frameset rows=“13%, 13% ,13%”> divides the screen into 3 equal horizontal sections. <frameset cols=“50%, 50%> splits 1st horizontal section into 2 equal vertical section. Frames tag cont……… • Other attributes (after division of screen)- SRC=“URL” Marginheight=n – specifies the amount of white space to be left at the top and bottom of frame. Marginwidth=n - specifies the amount of white space to be left along the sides of frame. Name= “name” – identification of frame. Scrolling – values are yes/no/auto. Frames tag cont……… • Example <frameset rows=“30,*”> <frameset cols=“50%,50%”> <frame src=“file1.html”> <frame src=“file2.html”> </frameset> </frameset>