Professional Documents
Culture Documents
Introduction to HTML
What is HTML?
Telling the browser what to do, and what props to use. A series of tags that are integrated into a text document. Tags are ; surrounded with angle brackets like this <B> or <I>. Most tags come in pairs exceptions: <P>, <br>, <li> tags The first tag turns the action on, and the second turns it off.
The second tag(off switch) starts with a forward slash. For example ,<B> text </B> can embedded, for instance, to do this: <HEAD><TITLE> Your text </HEAD></TITLE> it won't work. The correct order is <HEAD><TITLE> Your text </TITLE></HEAD> not case sensitivity. Many tags have attributes. For example, <P ALIGN=CENTER> centers the paragraph following it. Some browsers don't support the some tags and some attributes.
<HTML> See what it <HEAD> looks like: <TITLE>WENT'99</TITLE> </HEAD> <BODY> Went'99 </BODY> </HTML>
Basic Tags
Tag <html> <body> <h1> to <h6> <p> <br> <hr> <!--> Description
Defines an HTML document Defines the document's body Defines header 1 to header 6 Defines a paragraph
Tag
<b>
Description
Defines bold text Defines big text Defines emphasized text
<i>
Contd..
Tag Description Defines subscripted text Defines superscripted text Defines inserted text Defines deleted text
FRAME TAGS
Tag Description Defines a set of frames Defines a sub window (a frame) Defines a noframe section for browsers that do not handle frames
Add some Link Use <A href=filename|URL></a>tags Kinds of URLs -http://www.women.or.kr - ftp://ftp.foo.com/home/foo - gopher://gopher.myhost.com/ - news://news.nuri.net
Add Images
Introduction
CSS stands for Cascading Style Sheets Styles define how to display HTML elements CSS can save a lot of work CSS are stored in CSS files
CSS RULE
Syntax:
Selector { Property:Value; } Example : P { color:red; }
CSS ID
ID selector : - used to specify a style for a single, unique element. - uses the id attribute of the HTML element, and is defined with a "#". Example : #para1 { text-align:center; color:red; }
CSS Class
class selector -used to specify a style for a group of elements. -used on several elements. Example .center {text-align:center;}
Three Ways to Insert CSS External style sheet Internal style sheet Inline style
External style sheets (CSS) allow us to use one style sheet on multiple web pages Example: <head> <link rel="stylesheet"type="text/css"href="mystyle.css " /> </head>
An internal style sheet should be used when a single document has a unique style. We define internal styles in the head section of an HTML page Example: <head> <style type="text/css"> hr {color:sienna;} p {margin-left:20px;} body {backgroundimage:url("images/back40.gif");} </style> </head>
Inline Styles
To use inline styles we use the style attribute in the relevant tag. The style attribute can contain any CSS property. Example: <p style="color:sienna;margin-left:20px">This is a paragraph.</p>
Cascading order Browser default External style sheet Internal style sheet (in the head section) Inline style (inside an HTML element)
JavaScript is
JavaScript is an interpreted programming language
Open and cross-platform JavaScript can read and write HTML elements JavaScript can be used to validate data
Less server interaction: of JavaScript You can validate user Advantagespage off to the server. input before sending the This saves server traffic, which means less load on your server. Immediate feedback to the visitors: They don't have to wait for a page reload to see if they have forgotten to enter something. Increased interactivity: You can create interfaces that react when the user hovers over them with a mouse or activates them via the keyboard. Richer interfaces: You can use JavaScript to include such items as drag-and-drop components and sliders to give a Rich Interface to your site
A JavaScript consists of JavaScript statements that are placed within the <script>... </script> HTML tags in a web page. You can place the <script> tag containing your JavaScript anywhere within you web page but it is preferred way to keep it within the <head> tags. The <script> tag alert the browser program to begin interpreting all the text between these tags as a script. So simple syntax of your JavaScript will be as follows <script ...> JavaScript code </script>
Javascript syntax
The script tag takes two important attributes: language: This attribute specifies what scripting language you are using. Typically, its value will be javascript. Although recent versions of HTML (and XHTML, its successor) have phased out the use of this attribute. type: This attribute is what is now recommended to indicate the scripting language in use and its value should be set to "text/javascript". So your JavaScript segment will look like: <script language="javascript" type="text/javascript"> JavaScript code </script>
If some of the data entered in the wrong form or was simply missing, the server would request that the form be resubmitted with correct information.
Form validation generally performs two functions. Basic Validation - First of all, the form must be checked to make sure data was entered into each form field that required it. This would need just loop through each field in the form and check for data. Data Format Validation - Secondly, the data that is entered must be checked for correct form and value. This would need to put more logic to test correctness of data.
//-->
</script> </head> <body> <form name="email_form" action="submitpage.htm" onsubmit="return validate_form()" method="post"> Email: <input type="text" name="email" size="30"> <input type="submit" value="Submit"> </form> </body> </html>