unit-1

55
HTML (HYPERTEXT MARKUP LANGUAGE) UNIT-I 1 Internet computing with ASP.NET

description

ASP.NET Notes for Unit 1 containing HTML & CSS & ASP.NET introduction

Transcript of unit-1

Html (hypertext markup language)

Html (hypertext markup language)UNIT-I1Internet computing with ASP.NET1Internet:The largest network of networks in the world.Internet is a structure made up of million of interconnected computers whose users can communicate with each other and share information.Providing an infrastructure for the use of E-mail, bulletin boards, file archives, hypertext documents, databases and other computational resources.The Internet can be defined as a network of globally connected computers that is decentralized by design, Client, Web Server,Browser,URL,Web Page , ISP(internet service provider).

2Internet computing with ASP.NETPrepared by Mr.Javed sayyadInternet continue..Runs on any communications substrate.The main idea behind internet is protocol.The Protocol is a set of rules.There are Several Type of Protocols that is:TCP/IP,FTP,TELNET,HTTP&HTTPS.In this protocol there are several layers is used for communication that is application layer, transport layer, internet layer, network layer, physical layer etc.

3Internet computing with ASP.NETPrepared by Mr.Javed sayyadApplication of internet:Domain Name Service(Com,net,org,in)Proxy Service(multiple network server)Mail Service(mail client,email server)Web Service(web server)

4Internet computing with ASP.NETPrepared by Mr.Javed sayyadwww(world wide web) :A distributed document delivery systemUses a client-server modelMain presentation language is HTML

5Internet computing with ASP.NETPrepared by Mr.Javed sayyadWeb designing:Web browserEditorWeb pageWeb siteHome pageLanguage(html,js,css)

6Internet computing with ASP.NETPrepared by Mr.Javed sayyadWeb browser:Web browser is the software program that accesses the web document and displays it contents on the users computer.Different type of browser: Internet Explorer (www.microsoft.com) Firefox (www.mozilla.org) Safari (Mac - www.apple.com) The purpose of a Web browser is to retrieve and display information from a Web server by using HTTP.

7Internet computing with ASP.NETPrepared by Mr.Javed sayyad User Interface data persistenceBrowser Engine

Rendering Engine

Networking js interpreter XML Parser Display backendArchitecture of web browser8Internet computing with ASP.NETPrepared by Mr.Javed sayyadWebpage: Static webpage Pages are called Static because text, photos, and other content will not change unless the actual web page file itself is edited.Pages typically contain text, hyper links, photos, and graphics.Changes to the main Navigation Menu will require an edit to every web page that contains this menu.Web development software can automate Navigation Menu maintenance, but pages will still need to be re-published for changes to take effect.9Internet computing with ASP.NETPrepared by Mr.Javed sayyadWebpage : dynamic webpagePages are Dynamic that they can draw ever changing Content from external information sources.Pages can provide Create, Retrieve, Update, and Delete functions for records.Information that is already maintained in Systems such as Databases, Spreadsheets, and text files can be used as Web Content.

10Internet computing with ASP.NETPrepared by Mr.Javed sayyadWebsite and Home page :A collection of linked Web pages that has a common theme or focus is called a Web site.A website, also written as web site, or simply site, is a set of related web pages typically served from a single web domain. A website is hosted on at least one web server, accessible via a network such as the Internet or a private local area network through an Internet address known as a Uniform resource locator.The initial or main Web page of a website, sometimes called the "front page or Home page.The main page that all of the pages on a particular Web site are organized around and link back to is called the sites home page.

11Internet computing with ASP.NETPrepared by Mr.Javed sayyadWeb server:Web is a collection of files that reside on computers, called Web servers, that are located all over the world and are connected to each other through the Internet.Web server is the computer that stores the web document that users access.Web Pages are arranged in a directory structure in the Web Server.HTTP (Hyper Text Transfer Protocol) is used to transfer web pages from a Web Server to Web Client (Browser).

12Internet computing with ASP.NETPrepared by Mr.Javed sayyadHypertext : Hypertext is a system of storing images, text, and other computer files that allows direct links to related text, images, sound, and other data. Hypertext is the main basis of operation for the web.It is an information database or medium that links verbal and nonverbal information on the web.Hypertext links called hyperlinks create a complex virtual web of connections for users.

13Internet computing with ASP.NETPrepared by Mr.Javed sayyadHypermedia :Hypermedia combines the words hypertext and multimedia. Hypermedia is an updated extension of text in hypertext.Hypermedia documents contain links to other pieces of text, sound, images, movies, and other forms of media.Hypermedia documents are like hypertext, except that they also contain links to other forms of media like movies, sound, and images.14Internet computing with ASP.NETPrepared by Mr.Javed sayyadIntroduction to html :HTML Hyper Text Markup Language HTML documents describe web pages (Static Web Page). HTML tags are keywords surrounded by angle brackets like . HTML tags normally come in pairs like and . The first tag in a pair is the start tag (opening tags), the second tag is the end tag(closing tags)

15Prepared by Mr.Javed sayyadInternet computing with ASP.NETVersions of html : HTML is an evolving standard (as new technology/tools are added) . HTML 1 (Berners-Lee, 1989): very basic, limited integration of multimediain 1993, Mosaic added many new features (e.g., integrated images)

HTML 2.0 (IETF, 1994): tried to standardize these & other featuresin 1994-96, Netscape & IE added many new, divergent features

HTML 3.2 (W3C, 1996): attempted to unify into a single standardbut didn't address newer technologies like Java applets & streaming video

HTML 4.0 (W3C, 1997): current standard (but moving towards XHTML)attempted to map out future directions for HTML.

16Prepared by Mr.Javed sayyadInternet computing with ASP.NETVersions :XHTML 1.0 (W3C, 2000): HTML 4.01 modified to conform to XML standards

XHTML 1.1 (W3C, 2001): Modularization of XHTML 1.0

HTML 5 (Web Hypertext Application Technology Working Group, W3C, 2006): New. HTML 5 is referred to as a "living language".

17Prepared by Mr.Javed sayyadInternet computing with ASP.NETElement of html : HeadingThis HTML element is used to determine headings on a webpage. ImagesThe image element can be used to add images, to your webpage.LinksThe link element can be used to link different pages of the website.

18Internet computing with ASP.NETPrepared by Mr.Javed sayyadSTRUCTURE OF HTML DOC. :

--------

-----------

19Prepared by Mr.Javed sayyadInternet computing with ASP.NETBUILD AND EXECUTE HTML DOC :WHERE WE WRITE CODE : 1.Text Editor 1.Wordpad (In Windows OS) 2.Gedit Text Editor (LINUX) 2.FrontPage or DreamweaverWHERE WE EXECUTE : 1.Double Click that HTML File. (or) 2.Right click Open With Internet Browser20Prepared by Mr.Javed sayyadInternet computing with ASP.NETHtml tags:HTML (Hypertext Markup Language) is used to create document on the World Wide Web.It is simply a collection of certain keywords called Tags that are helpful in writing the document to be displayed using a browser on Internet. html used the different tags for different purpose . It is mainly divided in different five section.HTML PAIRED AND SINGULAR TAGS. HTML TEXT FORMATING TAGS AND TEXT STYLE TAGS.HTML CENTERING AND SPACING TAGS. HTML TABLE AND FRAMESET TAGS. HTML LINKING AND FORM TAGS.

21Prepared by Mr.Javed sayyadInternet computing with ASP.NETAttributes Sometimes we need more information for an element in order to control the way the content displays We provide this information with attributes stated within the element start tagThe generic way of using an attribute looks like this:Target content Single or double quotes may be used to hold attribute values

22Prepared by Mr.Javed sayyadInternet computing with ASP.NETDifferent tags of html :

All markup must be placed within HTML tags

Contains information about the page as well as other non-display content

All display content should go inside these tags This is a heading the number can range from 1 to 6 for different sizes. 23Prepared by Mr.Javed sayyadInternet computing with ASP.NETDifferent tags of html :

Tells the browser that the enclosed text should be set off in a paragraph. or Bolds the tagged text or Italicizes the tagged text
Inserts a line break This is an empty tag it does not have a closing tag.

24Prepared by Mr.Javed sayyadInternet computing with ASP.NETDifferent tags of html :

Inserts a horizontal rule (line)This is another empty tag An HTML Comment which is NOT displayed in the page is done like this: HyperlinksHyperlinks are created using the tag, which stands for anchor. The format looks like this:Content to click on for the link

25Prepared by Mr.Javed sayyadInternet computing with ASP.NETDifferent tags of html :TablesTables require three different tags:

Defines the table itself

Defines a table row

Defines a table cell (table data)

26Prepared by Mr.Javed sayyadInternet computing with ASP.NETDifferent tags of html :

is similar to but displays heading centered in bold.

Colspan:If you want data spans more than one column then colspan.

Rowspan:similarly, can span more than one row then rowspan

27Prepared by Mr.Javed sayyadInternet computing with ASP.NETDifferent tags of html :Font You can modify more exactly the way text looks by using the tag:

This is red, size 3, and in Garamond!

ListsTwo main types:Unordered list

Ordered List

List items are indicated by

28Prepared by Mr.Javed sayyadInternet computing with ASP.NETDifferent tags of html :Image include images using img tag.by default, browsers can display GIF and JPEG files.other image formats may require plug-in applications for display.Syntax: img src="URL (or filename)" height="n" width="n" alt="text" title= "text" />

29Prepared by Mr.Javed sayyadInternet computing with ASP.NETDifferent tags of html :Frame and Framesetframes provide the ability to split the screen into independent partsframeset is used for the splinting a browser into frames.After dividing screen into subpart with the help of frame tag data inserted into that subpart. 30Prepared by Mr.Javed sayyadInternet computing with ASP.NETHtml form : is just another kind of HTML tagHTML forms are used to create (rather primitive) GUIs on Web pagesUsually the purpose is to ask the user for informationThe information is then sent back to the serverA form is an area that can contain form elementsThe syntax is: ...form elements... Form elements include: buttons, checkboxes, text fields, radio buttons, drop-down menus, etc Other kinds of HTML tags can be mixed in with the form elementsA form usually contains a Submit button to send the information in he form elements to the serverThe forms parameters tell JavaScript how to send the information to the server .Forms can be used for other things, such as a GUI for simple programs31Forms and JavaScript :The JavaScript language can be used to make pages that do somethingYou can use JavaScript to write complete programs, but...Usually you just use code of JavaScript here and there throughout your Web pageJavaScript code s can be attached to various form elements. For example, you might want to check that a zipcode field contains a 5-digit integer before you send that information to the server.Microsoft sometimes calls JavaScript active scriptingHTML forms can be used without JavaScript, and JavaScript can be used without HTML forms, but they work well together

32The tag : The ... tag encloses form elements.The arguments to form tell what to do with the user inputaction="url"(required)Specifies where to send the data when the Submit button is clickedmethod="get"(default)Form data is sent as a URL with ?form_data info appended to the endCan be used only if data is all ASCII and not more than 100 charactersmethod="post"Form data is sent in the body of the URL requestCannot be bookmarked by most browserstarget="target"Tells where to open the page sent as a result of the requesttarget= _blank means open in a new windowtarget= _top means use the same window

331.$_GET:The built-in $_GET function is used to collect values from a form sent with method="get".Information sent from a form with the GET method is visible to everyone (it will be displayed in the browser's address bar) and has limits on the amount of information to send (max. 100 characters).When using method="get" in HTML forms, all variable names and values are displayed in the URL. Methods2.$_POST:Information sent from a form with the POST method is invisible to others and has no limits on the amount of information to send.because the variables are not displayed in the URL, it is not possible to bookmark the page.3.$_REQUEST:Contains the values of both the $_GET and $_POST arrays combined, along with the values of the $_COOKIE super global array.MethodsThe tag : form elements use the input tag, with a type="..." argument to tell which kind of element it istype can be text, checkbox, radio, password, hidden, submit, reset, button, file, or imageOther common input tag arguments include:name: the name of the elementvalue: the value of the element; used in different ways for different values of type readonly: the value cannot be changeddisabled: the user cant do anything with this elementOther arguments are defined for the input tag but have meaning only for certain values of type 3637Form control :Text input

A text field: A multi-line text field HelloA password field:

38Buttons A submit button: A reset button: A plain button:

submit: send data.

reset: restore all form elements to their initial state.button: take some action as specified by JavaScript.

39CheckboxesA checkbox: