Scribd
Upload
6 views10 pages

HTML

The document provides an overview of HTML, detailing its basic structure, including lists, tables, images, links, and forms. It explains how to use various HTML tags such as <ol>, <ul>, <img>, <a>, and <table> to create well-structured web pages. Additionally, it introduces advanced features like the <marquee> tag for scrolling text and the importance of CSS in web design.

Uploaded by

rim.07rhyme
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF or read online on Scribd
6 views10 pages

HTML

The document provides an overview of HTML, detailing its basic structure, including lists, tables, images, links, and forms. It explains how to use various HTML tags such as <ol>, <ul>, <img>, <a>, and <table> to create well-structured web pages. Additionally, it introduces advanced features like the <marquee> tag for scrolling text and the importance of CSS in web design.

Uploaded by

rim.07rhyme
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF or read online on Scribd
aa oe HTML Advanced Features be > Lists in HTML Inserting Tables © Inserting Images in Web Pages Displaying objects through > Inserting Links Creating Forms HTML PROGRAMMING HTML or Hyper Text Markup Language is the basic computer language for creating HTML documents or web pages. HTML codes and tags specifies the format and layout to create web pages that can be accessed and displayed through a browser. HTML tags are one of the most fundamental elements in writing © Jo) the HTML code. Tags are HTML commands which tell your yup § ig the fifth and current browser what to show on a web page. All tags start with a <(left fur vesion of FHM: Ieee fist bracket) and end with a > (right bracket). HTML documents are yeleased on 22 January 2008. saved with the file extension .html. CE hi In HTML, Lists are used to display information in a well-organised manner. HTML lists enable to achieve a structured look of the HTML documents, making it easy to maintain the document. In HTML, there are mainly three types of lists: 1. Ordered list: It is used to arrange a group of related items in a numbered or alphabetical order. 2. Unordered list: It is used to arrange a group of items in any order. ‘There is no specific rule that one item in the list should come after another, 3. Description list It is used to give values to the list of terms used. It isa name/value pair combination. Ordered lists In HTML, Ordered lists or numbered lists are used to display alist of items in a defined or specific order using numerical or alphabetical values. For example, the recipe of cooking a dish. The steps to be followed are numbered in a specific order according to the recipe. In HTML (ordered list is defined using the tag.)The HTML tag to define the list item ordered lists the tag. In the ordered or numbered lists, there are various number options that can be given for the listed item Plain numbers 9 @O@ the Uy q SeannedwithCamScanner Capital Letters , Small Letters Capital Roman Numbers «Small Roman Numbers type Attribute In HTML, the ordered lists use the attribute “Type’ to specify the style of numbering options like plain numbers, roman numbers, capital roman and so on. ‘The various values that type attribute can take is A, a, land i. When the list tag does not specify any type attribute, the default value of type attribute will be normal numbers like 1, 2,3 and so on. For example, enter the following code in Notepad. “The result will be as shown in Figure |.
    coun SG onawnnne x ae ise dlisCoffeec/li> oe clistkesli> i sue A Coltee 3 Mik aa clscotteec/l> 1 Stak
tag is used to define an unordered list. The In Unordered lists, there are the following bullet op & Dise Circle Square The default bullet in an unordere Style of bullets used. EE Wg o2@0 6089 So Dral Qa individual items are listed with bullet signs. In HTML, the i> is used to list out the items in the unordered list. ptions: cd lst is disc. Whe type attribute is used in an unordered list to define the SeannedwithCamScanner Capital Letters Capital Roman Numbers small Roman Numbers type Attribute ATML, the ordere e attribute “Type’ In HT ¢ ordered lists use the attribute “Type’ to specify the style of numbering options like plain numbers, roman numbers, capital roman and so on. ‘The various values that type attribute can take is A, a, Land i. When the list tag does not specify any type attribute, the default value of tyPe attribute will be normal numbers like 1, 2,3 and so on. For example, enter the following code in Notepad. so ‘The result will be as shown in Figure 1. | 2 Milk lisCoffees/I> 1 | come < | |b Mille | A. Coffee | B. Milk
    \ |
  1. Coffee
    2. Figure 1: Ordered List
Unordered Lists ‘An unordered list isa list of items in tag is used to define an unordere In Unordered lists, there are the following bullet options items are listed with bullet signs. In HTML, the which the individual it \s in the unordered i list, 'The tag is used to list out the item: % Disc Circle /» Square , 7 Ceci ullet in an unordered list is dis ihe type attribute is used in an unordered list to define the Style of bullets used. : Cede ive) SS BaD iin en ~ —_ Bra OO TED SeannedwithCamScanner For example, enter the following code in Notepad “the result is shown in Figure 2. | eul> | | Ch canmspwinonoms «(A Ry sli>Milke/lis | ° ae kl _sfulscul types"dise"> || «cate sliscoffeeMilke/li> + Clee | | | + Cotte
    | Ss es | + Mak |
| Im eneve ‘edd>Hours Minutes Seconds comes | Figure 3: Description List ts ; i Jo Notepad is the basic text-based HTMLpbditor) The other popular HTML editors are Aptana St Notepad i ne ish, Phase 5 HTML editof These editors are IDEs, IDE stands for integrd - Development Environment. mm G © OO ©08> - SeannedwithCamScanner ISI cs ‘TML, it is possible to display In ee 7 ee ° display images in the webpages using the tag and SRC attribute, The 5 ™ sert images in HTML documents or in wel c(t e tag Here, the value of the src attribute is the location where the image is saved. (the image should be saved in the same directory where html document is saved. ) For example, Figure 4 shows an image being inserted to a webpage using the H Download any image of strawberries from the Internet and save it on your system. 'TML code given below. ae = | I j | Imertan ima }

insert an image

| | Figure 4: Image inserted in HTML ea Links are the pointers in HTML that enable the user to navigate from one web page to another. Links are the key elements in World Wide Web, It connects related documents together and displays through web pages to the user. ‘The start and end poi destination anchor whi Hled anchors. ‘The link starts at the source anchor and points to the of alink are cal audio or video clip, pdf files and so on. ch can be a web page, Anchor Tag In HTML, links are created using special tag, ~Beginning of the link and closing tag indicates called the anchor tag . The opening tag defines the the end of the link. href attribute ‘The href attribute specifies the target of the link. will act as the link. For creating links in should work as a link and close the tag aE Vivaild a & Dual aap Camara ‘The value specified within with the href attribute =“ ">, Add the text that HTML, you simply have to specify the target in the . SeannedwithCamScanner Usage of Link text For example, the following HTML code using will ereate com and [Link] a webpage with a link to WH goog 7 . eo emernanen + | _<3 href="[Link]">[Link] ° * Click to go to yahoo. carta Figure 5: Link in HTML GED _~ By default, a link on a webpage will appear in blue colo} USeisact ils Cegay \ 1635 In HTML, tables are used to arrange data like text, images, inks, forms, and so on in to rows and columns “Tables are also used to create page layout of the HTML pages. Jur till the user clicks on it. tag ‘Tables in HTML are defined with the tag. Attributes of
tag Using the table tag in HTML, you can begin the process of building a table. But for defining various te properties like borders, height, cell space and so on, various tag attributes are used which are follows: , Border: It is used to specify the border of a table. For example,
« Bordercolor: Specify the colour of the border. For example, «Cell Spacing: Specify the amount of space between cells, For example, Align: Specify the alignment of table to center, right or left For example,
[Link] [eicorosooe [NESE © * Hick to go to yahoo: peste Figure 5: Link in HTML {ar in blue colour till the user clicks on it By default, a link on a webpage will appe PSEiaar ori) forms, and so on in to rows and columns, In HTML, tables are used to arrange data like text, images, links, Tables are also used to create page layout of the HTML pages. tag Tables in HTML are defined with the tag. Attributes of
tag Using the table tag in HTML, you can begin the process of buildi properties like borders, height, cell space and so on, various and tag ‘A table is divided into ro cells with the tag, WI forms and other tables. oiwalll) ing a table, But for defining various table Dble> tag attributes are used which are as It is used to specify the border of a table. of the table. DISPLAYING OBJECTS THROUGH In HTML, Marquee is a tag used to move or scroll text or an image on a web page. used in HTML to make the objects scroll across the web p: is the opening tag and is the closing tag, mak text or image specified with source will be scrolled across the sereen on the web page. “There are various attributes for the tag which are given as follows: ©. Behavior: The attribute behavior can be set to di e scroll, slide or alternate where the text will scroll slide or will move back and forth once it touches the sides of the window fe value can be set to up, down, left or right where the text will move according gure 6: Table in HT! ‘The tag is ita container tag in HTML. Any Direction: ‘This attribut to the set direction. ©. §crolldelay: This attribute will decide the speed of the text bei document with its attributes. scrolled across the screen. Let us see the use of tag in HTML enter the following code in notepad and save as an Ch cunweneinenr x | HEN ° cs < “Tone Merge Tat behavior=“alternate”> marquee direction="Teft” _scrolidelay="800" Testing Marquee Tags/marquee? on a webpage will appear in blue colour sil Mitton 02000 © O Amie SeannedwithCamScanner @ Future Ready : ent CSS or Cascading Style Sheet is used to design the html docum the screen. CSS plays an important role in web designing: CREATING FORMS for entering data, ‘e web pages with fields, 5, text box er elements and are ext boxes and other cle eae veb pages with fields, buttons ext Doxts A ther “ade ; hed ta . Forms ate generally used for data verification and authentic n or to maintain ed of the data, a he main elements of forms are: “Scrolling lists © Text box ©. Radio buttons ee Password input columns —®._ Check boxes ‘Text areas < and to specify how it appears op » Menu buttons - In HTML, form is a container tag with as the start tag and as the closing tag, ‘There are two main attributes in , namely action and method. Action attribute: In the tag, the action attribute refers to the file name where the values entered by the user in the form will be saved or submitted for processing, It can be an html file or a php, .net ores file. The value of action attribute can be a file name or a url address where the file is located. Method attribute: The method attribute tells us how the form data should be sent to the server for processing. For creating simple forms with text boxes, radio buttons and so on, tag is used in HTML. ‘The tag creates an input field where the user can enter the data. ‘The tag can have differen values like text boxes, radio buttons, text areas, check boxes and 50 on. ‘The tag, you can define whether a textbox ig for entering name or password/ Labels help the user to identify the purpose ofeach textbox in the form Foter the following code in Notepad to create forms in HTML, / an | |g

1 cquwentannaramoes % [E x) Male O Maths O Physics CO Chemistry «label for="female”>Female

label for="soccer">Maths Physicse/label> Figure 8: Forms in HTML chemistry/labeb SeannedwithCamScanner HIPML tags are one of the most f Jamental elements used for writing HTML code inj 4 ‘Tags are HTML commands which tells your browser what to show on a web page. ae 4 WWHTEML, lists are used to display information in a well-organised manner, 46 The simg> tag is used to in in HTML documents or in web pi 4 Links are the pointers in HTML that enable the user to navigate from one web page to another. 4 INHITML, links are created using a special tag, anchor tag, 4 ‘The href attribute specifies the target of the link. ‘The value specified within with the href attribute will act as the link, M4 Tables in HTML are defined with the tag Ke In HTML, Marquee is a tag used to move or scroll text or an image across the defined space of a web page. K€ IW HTML, forms are interactive web pages with fields, buttons, text boxes and other elements used for entering dat Prt SeannedwithCamScanner

You might also like

First row, first column of 7 the table. First row, first column of thi <| side.This is row two, right