Html.ppt

Overview
 HTML
 DHTML
 JAVA SCRIPT

“Knowledge “
Web server:- A system on the internet congaing one or
more web site.
Web site:- A collection of one or more web pages
Web pages:- Single disk file with a single file name
Home pages:- First page in website

HTML:-
 HTML(Hypertext markup language) is used to define
the different part of page.
 Telling the browser what to do, and what props to
use.
 A series of tags that are integrated into a text
document

Creating a HTML File
1. Open Notepad
2. Click on File -> Save as…
3. In the File name pull-down box, type in webpage.html
4. Click on Save
5. Type in content for your file
6. Once you finished the content, click on File -> Save

HTML TAGS
What are the basic tag?
 <html> </html>
 <head> </head>
 <title> </title>
 <Body> </body>
 <p>
 <br>
 <Center> </Center>
 <b></b> e.g. :-<b> APJ</b> result = APJ
 <i></i> e.g. :-<i> APJ</i> result = APJ

Tags in head
• <HTML>…</HTML>-- All the info web page. Or all tags
• <HEAD>...</HEAD>-- contains information about the
document
• <TITLE>...</TITLE>-- puts text on the browser's title bar.

Tags in body
 Heading: <H1> </H1>
 Center:<Center> </Center>
 Line Break <P> ,<Br>
 Phrase Markups: <I></I> ,<B></B>

HTML Document Structure
<html>
<head>
<title> Page Title Goes Here </title>
</head>
<body>
content goes here “THIS IS MY WEB PAGE”
</body>
</html>

Add Image in web page
 Use <IMG SRC=imagefilename> tags
e.g. :-
<img src=D:wallpaperbad boy

Image Formats
 .gif
-Graphics Interchange Format
 .jpeg or .jpg
-Joint Photographic Experts Group
 .bmp
-bitmap

Image Size
 Computer images are made up of “pixels”
 <IMG HEIGHT=“100" WIDTH=“150" SRC="image.gif">
Width
Height

How to make create color
Color names : <Font color=white>
• Changing the Background color
<BODY BGCOLOR=#19378a>
• Changing Text color
<BODY BGCOLOR=#19378a TEXT=#ffffff LINK=#ffff66
VLINK=#66ffff>
• Spot color
<FONT COLOR=#66ffcc>WENT'99</FONT>
• Image Background
<BODY BACKGROUND=bgimg.gif >

Font
 To change text size
 <font size=“+3”>Hello</font>
 Output: Hello
 To change text color
 <font color=“red”>Hello</font>
 Output: Hello
 Using both
 <font size=“+3” color=“red”>Hello</font>
 Output: Hello
Tag attribute

Headings
 There are 6 heading commands.
<H1>This is Heading 1</H1>

List Unordered list
-Code:
<ul>
<li>Coffee</li>
<li>Milk</li>
</ul>
-Output:
 Coffee
 Milk
 Ordered list
-Code:
<ol>
<li>Coffee</li>
<li>Milk</li>
</ol>
-Output:
1. Coffee
2. Milk

Table
<table border=“1">
<tr>
<th>Heading</th>
<th>Another Heading</th>
</tr>
<tr>
<td>row 1, cell 1</td>
</tr>
<tr>
<td></td>
</tr>
</table>
Heading Another Heading
Row 1, cell 1 Row 1, cell 2
Row 2, cell 1

Create Links
 A Hypertext link
 < a href=“http://www. apjim.org”>apj Home</a>
 Output: APJ Home
 A Email link
 <a href=“mailto:RAMGOPAL@gmail.com”>
Email me</a>
 Output: Email me

Forms
 A form is an area that can contain form elements.
 <form></form>
 Commonly used form elements includes:
 Text fields
 Radio buttons
 Checkboxes
 Submit buttons

Text Input Fields
 Used when you want the
user to type
letters, number, etc.
<form>
First name: <input
type="text"
name="firstname">
<br>
Last name: <input
type="text"
name="lastname">
</form>
 Output
First name:
Last name:

Submission Button
 When user clicks on the
“Submit” button, the
content of the form is sent
to another file.
<form name="input"
action="html_form_action.
asp" method="get">
Username: <input
type="text" name="user">
<br>
<input type="submit"
value="Submit">
</form>
 Output
Username:

Text Box
 Used when you want to get
input from user.
<form>
<p>Please provide your
suggestion in the text box
below:</p>
<textarea row=“10”
cols=“30”>
</textarea>
</form>
• Output
Please provide your
suggestion in the text box
below:

Pull-down Menu
 Used when you want user
to respond with one
specific answer with
choices you given.
<p>Select a fruit:</p>
<select name"Fruit">
<option selected> Apples
<option> Bananas
< option > Oranges
</select>
• Output
Select a fruit:

Sample page of Code
<html>
<head><title>First Page</title></head>
<body>
Hello! This is my first page of code. I can't believe I'm
on my way to being a webmaster. This is so great!!!
</body>
</html>

DHTML
 Dynamic HTML.
 Just as access is dynamic database environment.
 Can have control that respond to events.
 Can have control code module.
 Can be written in VB(script)

INTERNRT EXPLORAL DHTML
 Developing for two DHTML environment takes three
time the developing time.
 IE support active Xcontrol .
 IE support VB script.
 80% of the world browsing activity is done with IE.

ADVANTAGE OF DHTML
 Centralized code for distribution.
 Can be secure by using https.
 Richer event model higher control are display.
 Small foot print
 Can monitor usage easier.

DISADVANTAGE.
 Use script language that mean:-
-All variable are variants.
-Error handling is limited.
• Debugging can be awkward.

FEATURE
 Data binding.
 Behaviors or script.
 Support for XML.
 flexible object.

JAVASCRIPT :-
 JavaScript is programming language designed for
webpage's .protocols used by the JavaScript is
“http://”
 Developed by :Netscape. In 1995
 Purpose: to Create Dynamic websites.
 Widely Used (web designing).

Why Use JavaScript
 JavaScript enhances Web pages with dynamic and
interactive features.
 JavaScript runs in client software.

What Can JavaScript Do?
 Common JavaScript tasks can replace server-side
scripting.
 JavaScript enables shopping carts, form validation,
calculations, special graphic and text effects, image
swapping, image mapping, clocks, and more.

Operators in JavaScript
 Operators are used to handle variables.
 Types of operators with examples:
-Arithmetic operators, such as plus.
-Comparisons operators, such as equals.
-Logical operators, such as and.
-Control operators, such as if.
-Assignment and String operators.

Example Of JavaScript
<html>
<head>
<SCRIPT language = java script>
Var name=prompt(“RAMGOPAL”);
</SCRIPT>
</head>
<body>
<SCRIPT language =“java script”>
Document .write(“<H2>hello RAMGOPAL</H2>)
</script>
</body>
</html>

ADVANTAGE OF JAVASCRIPT
 Interpreted language.
 Embedded with HTML.
 Minimal syntax- easy to use.
 Quick development.
 Designed for simple and small program.
 Easy Debugging and testing.

Html.ppt

Empfohlen

Empfohlen

Weitere ähnliche Inhalte

Was ist angesagt?

Was ist angesagt? (20)

Andere mochten auch

Andere mochten auch (7)

Ähnlich wie Html.ppt

Ähnlich wie Html.ppt (20)

Kürzlich hochgeladen

Kürzlich hochgeladen (20)

Html.ppt