Lập trình web với Java pdf
Bạn đang xem bản rút gọn của tài liệu. Xem và tải ngay bản đầy đủ của tài liệu tại đây (1.57 MB, 38 trang )
1
Web Programming with Java
HyperText Markup Language Basics
Huynh Huu Viet
University of Information Technology
Department of Information Systems
Email:
2008 © Department of Information Systems - University of Information Technology
2
Outline
WWW Client/Server Model
HTML Basics
File Management and Tips
Sample Exercise
2008 © Department of Information Systems - University of Information Technology
3
Client/Server Model
WWW Client/Server Model
Client's Functions
Server's Functions
Client/Server Interaction
2008 © Department of Information Systems - University of Information Technology
4
WWW Client/Server Model
`
Client
Web Server
Request
Response
• Microsoft Internet Information Server
• Apache Web Server
•……
• Microsoft Internet Explorer
• Netscape Navigator
• Mozilla Firefox
•……
2008 © Department of Information Systems - University of Information Technology
5
Client's Functions
Handle the user interface.
Translate the user's request into the
desired protocol.
Send the request to the server.
Wait for the server's response.
Translate the response into "human-
readable" results.
Present the results to the user.
2008 © Department of Information Systems - University of Information Technology
6
Server's Functions
Listen for a client's query.
Process that query.
Return the results back to the client.
2008 © Department of Information Systems - University of Information Technology
7
Client/Server Interaction
2008 © Department of Information Systems - University of Information Technology
8
Client/Server Interaction
2008 © Department of Information Systems - University of Information Technology
9
Client/Server Interaction
2008 © Department of Information Systems - University of Information Technology
10
Client/Server Interaction
2008 © Department of Information Systems - University of Information Technology
11
Client/Server Interaction
2008 © Department of Information Systems - University of Information Technology
12
Client/Server Interaction
2008 © Department of Information Systems - University of Information Technology
13
Client/Server Interaction
2008 © Department of Information Systems - University of Information Technology
14
Outline
WWW Client/Server Model
HTML Basics
Tags
Structure
Formatting
Graphics
Links
Tables
Colors
File Management and Tips
Sample Exercise
2008 © Department of Information Systems - University of Information Technology
15
HTML Basics: Tags
Tag – HTML Command
Used for
Text formatting
Image formatting
Hyperlinks
Other information
HTML Tag Structure:
<tag> text </tag>
<tag attribute=argument> text </tag>
2008 © Department of Information Systems - University of Information Technology
16
HTML Basics: Structure
<html>
<head>
…
</head>
<body>
…
</body>
</html>
2008 © Department of Information Systems - University of Information Technology
17
HTML Basics: Head Tags
<head>
<title> Weiss Associates </title>
<meta name=“keywords” content=“…”>
<meta name=“description” content=“…”>
<style> </style>
</head>
2008 © Department of Information Systems - University of Information Technology
18
HTML Basics: Body Tags
<body bgcolor=“red”>
<body background=“images/darthvader.jpg”>
<body link=“red” vlink=“blue” alink=“orange”>
2008 © Department of Information Systems - University of Information Technology
19
HTML Basics: Text Formats
<pre></pre>Creates preformatted text
<h1></h1> Creates the largest headline
<h6></h6> Creates the smallest headline
<b></b> Creates bold text
<i></i> Creates italic text
<em></em> Emphasizes a word
<font size=#></font> Sets size of font, from 1 to 7
<font color=?></font> Sets font color
2008 © Department of Information Systems - University of Information Technology
20
HTML Basics: Formatting
<hr> Creates a horizontal line
<center></center> Centers a block of text
<p></p> Creates a new paragraph
<p align=?> Aligns a paragraph to the left, right, or center
<br> Inserts a line break
<blockquote> </blockquote> Indents text from both sides
<ol></ol> Creates a numbered list
<li></li> Precedes each list item, and adds a number
<ul></ul> Creates a bulleted list
2008 © Department of Information Systems - University of Information Technology
21
HTML Basics: Graphics
<img src="name">
Adds an image
<img src="name" align=?>
Aligns an image: left, right, center; bottom, top, middle
<img src="name" border=?>
Sets size of border around an image
<img src="name" width=? height=?>
Sets size of of an image in pixels
2008 © Department of Information Systems - University of Information Technology
22
HTML Basics: Links
<a href="URL"></a>
Creates a hyperlink
<a href="mailto:EMAIL"></a>
Creates a mailto link
<a name="NAME"></a>
Creates a target location within a document
<a href="#NAME"></a>
Links to that target location from elsewhere in the document
2008 © Department of Information Systems - University of Information Technology
23
HTML Basics: Tables I
<table></table> Creates a table
<tr></tr> Sets off each row in a table
<td></td> Sets off each cell in a row
2008 © Department of Information Systems - University of Information Technology
24
HTML Basics: Tables II
<table border=#> Sets width of border around table cells
<table cellspacing=#> Sets amount of space between table cells
<table cellpadding=#> Sets amount of space between a cell's border and
its contents
<table width=# or %> Sets width of table - in pixels or as a percentage of
document width
<tr align=?> or <td align=?> Sets alignment for cell(s) (left, center, or
right)
<tr valign=?> or <td valign=?> Sets vertical alignment for cell(s) (top,
middle, or bottom)
<td colspan=#> Sets number of columns a cell should span
<td rowspan=#> Sets number of rows a cell should span (default=1)
2008 © Department of Information Systems - University of Information Technology
25
HTML Basics: Colors
Use predefined colors, or
Hex Codes (0-9ABCDEF)
