Head Body Title and Meta Tags HTML b
Head, Body, Title and Meta Tags
HTML
ﻣﺘﻦ ﻧﻤﺎیﺶ • • • • <b> <strong> <i> <em> <u> <super> <sub> <big> <small> <strike> < > <HR> <img> <center> <H 1>, <H 2>, <H 3>, <H 4> <P>
ﻗﻠﻢ ﺗﻌییﻦ <FONT FACE=“Arial" size="4" color="#0033 FF">
ﺩیگﺮ ﺍﺳﻨﺎﺩ ﺑﻪ ﺍﺭﺟﺎﻉ : ﺩﻫیﻢ ﻣی ﻧﺴﺒﺖ href ﺑﻪ ﺭﺍ ﺳﻨﺪ URL • <a href="http: //www. Computersof. Tomorrow. com"> : ﺍﻟکﺘﺮﻭﻧیکی • پﺴﺖ <A HREF= "mailto: faghih@ce. sharif. edu? subject= CW-Assignment"> Send your assignment. </A>
ﺗﺼﻮیﺮ ﺩﺭﺝ <img src="mycomputer. gif" width="70" height="55" alt="computr 73. gif “>
ﻫﺎ ﺟﺪﻭﻝ <table border="1"> <tr> <td>row 1, cell 1</td> <td>row 1, cell 2</td> </tr> <td>row 2, cell 1</td> <td>row 2, cell 2</td> </tr> </table> <table border="1"> <tr> <td>Row 1, cell 1</td> <td>Row 1, cell 2</td> </tr> </table> <table border="1"> <tr> <th>Heading</th> <th>Another Heading</th> </tr> <td>row 1, cell 1</td> <td>row 1, cell 2</td> </tr> <td>row 2, cell 1</td> <td>row 2, cell 2</td> </tr> </table>
ﺻﻔﺤﻪ ﺑﻨﺪی ﻗﺴﻤﺖ <frameset cols="25%, 75%"> <frame src="frame_a. htm"> <frame src="frame_b. htm"> </frameset>
Textfield <form> First name: <input type="text" name="firstname"> Last name: <input type="text" name="lastname"> </form>
Radio Button <form> <input type="radio" name="sex" value="male"> Male <input type="radio" name="sex" value="female"> Female </form>
Checkboxes <form> I have a bike: <input type="checkbox" name="vehicle" value="Bike" > <br > I have a car: <input type="checkbox" name="vehicle" value="Car" > <br > I have an airplane: <input type="checkbox" name="vehicle" value="Airplane" > </form>
The Form's Action Attribute and the Submit Button <form name="input" action="html_form_action. asp" method="get"> Username: <input type="text" name="user"> <input type="submit" value="Submit"> </form>
Button • type=SUBMIT – Causes the data in the form fields to be sent to the CGI script. • type=RESET – Sets all the form fields back to their default value, or blank. • type=BUTTON – Performs no action on its own, but you can assign it one using Java. Script.
meta> tags> ﻣﺜﻞ ، ﺟﻮ ﻭ ﺟﺴﺖ ﻣﻮﺗﻮﺭﻫﺎی یﺎ ﻣﺮﻭﺭگﺮﻫﺎ ﺑﺎ ﻣﺮﺗﺒﻂ ﺍﻃﻼﻋﺎﺗی • ﺩﺍﺩﻥ ﺻﻔﺤﻪ ﻣﺤﺘﻮﺍی ﺗﻮﺻیﻒ This meta element defines a description of your page: <meta name="description" content="Free Web tutorials on Excel"> This meta element defines keywords for your page: <meta name="keywords" content=“Excel, Microsoft, tutorial, XML">
Animating text <FONT SIZE="4" FACE="courier" COLOR=blue><MARQUEE WIDTH=100% BEHAVIOR=ALTERNATE BGColor=yellow>This is an example of an alternating marquee. . . </MARQUEE></FONT> <FONT SIZE="4" FACE="courier" COLOR=blue><MARQUEE WIDTH=100% BEHAVIOR=SCROLL BGColor=yellow LOOP=3>This is an example of a scrolling marquee. . . </MARQUEE></FONT>
Animating text <FONT SIZE="4" FACE="courier" COLOR=blue><MARQUEE WIDTH=100% BEHAVIOR=ALTERNATE BGColor=yellow>This is an example of an alternating marquee. . . </MARQUEE></FONT> <FONT SIZE="4" FACE="courier" COLOR=blue><MARQUEE WIDTH=100% BEHAVIOR=SCROLL BGColor=yellow LOOP=3>This is an example of a scrolling marquee. . . </MARQUEE></FONT>
Animating text • ﺟﻬﺖ <FONT SIZE="4" FACE="courier" COLOR=blue><MARQUEE WIDTH=100% BEHAVIOR=SCROLL DIRECTION=RIGHT BGColor=yellow>This is an example of a marquee scrolling to the right. . . </MARQUEE></FONT> • ﺳﺎیﺰ <FONT SIZE="4" FACE="courier" COLOR=blue><MARQUEE BEHAVIOR=SCROLL HEIGHT=25 WIDTH=300 BGColor=yellow>This is an example of a scrolling marquee</MARQUEE></FONT>
<pre> ﻭ <xmp> <pre> • <xmp> • . ﺷﻮﻧﺪ ﻣی گﺮﻓﺘﻪ ﻧﺎﺩیﺪﻩ آﻦ ﺩﺭ html ﻫﺎی tag – <XMP> <A HREF="http: //www. idocs. com">Cool. Dude</A> </XMP> <PRE> < A HREF="http: //www. idocs. com“> Cool Dude< /A> </PRE>
ﻫﺎ Style Sheet ﻣکﺎﻥ <head> <style type="text/css"> hr {color: sienna} p {margin-left: 20 px} body {background-image: url("images/back 40. gif")} </style> </head> (<STYLE></STYLE>) Head • ﻣﺠﺰﺍ • ﻓﺎیﻞ – ﻣﺰیﺖ؟ <head> <link rel="stylesheet" type="text/css" href="mystyle. css" /> </head>
Javascript
HTML ﺩﺭ Javascript ﻗﺮﺍﺭﺩﺍﺩﻥ ﻃﺮﺯ <html> <head> <script type="text/javascript">. . </script> </head> <body> <script type="text/javascript">. . </script> </body> ---------------------------------------------<html> <head> <script src="xxx. js"></script> </head> <body> </html> /* */ یﺎ // : • ﺑﺮﺍی ﺩﺭﺝ ﺗﻮﺿیﺤﺎﺕ
If…Else <script type="text/javascript"> //If the time is less than 10, //you will get a "Good morning" greeting. //Otherwise you will get a "Good day" greeting. var d = new Date() var time = d. get. Hours() if (time < 10) { document. write("Good morning!") } else { document. write("Good day!") } </script>
For Loop <html> <body> <script type="text/javascript"> var i=0 for (i=0; i<=10; i++) { document. write("The number is " + i) document. write("<br />") } </script> </body> </html>
While Loop <html> <body> <script type="text/javascript"> var i=0 while (i<=10) { document. write("The number is " + i) document. write("<br />") i=i+1 } </script> </body> </html>
Popup Boxes • alert("sometext") • confirm("sometext") • prompt("sometext", "defaultvalue") var d = new Date() var time = d. get. Hours() if (time < 10) { document. write("Good morning!") } else { document. write("Good day!") prompt("current time", d) }
Function ﺗﺎﺑﻊ • ﺗﻌﺮیﻒ function prod(a, b) { x=a*b return x } ﺗﺎﺑﻊ • ﻓﺮﺍﺧﻮﺍﻧی product=prod(2, 3)
Function Example <html> <head> <script type="text/javascript"> function displaymessage() { alert("Hello World!") } </script> </head> <body> <form> <input type="button" value="Click me!" onclick="displaymessage()" > </form> </body> </html>
event handler <a href="http: //ce. sharif. edu" onmouseover="alert('Home. Page Of CE department')"> CE! </a> <img src=“a. jpg" width="100" height="30" onmouseover="alert('Home. Page Of CE department')">
Timing Events <html> <head> <script type="text/javascript"> function timed. Msg() { set. Timeout("alert('5 seconds!')", 5000) } </script> </head> <body> <form> <input type="button" value="Display timed alertbox!" on. Click="timed. Msg()"> </form> </body> </html>
window ﺷیﺀ
ﻫﺎ ﻓﺮﻡ ﺍﺟﺰﺍی <html> <form name="form 1"> <input type="radio" name="sex" value="male"> Male <input type="radio" name="sex" value="female"> Female </form> <script type="text/javascript"> document. form 1. sex[0]. checked = true; </script> <html>
XML
- Slides: 48