Lecture 3 4
Download as PPT, PDF
1 like715 views
Convert to study materialsBETA
Transform any presentation into ready-made study materialselect from outputs like summaries, definitions, and practice questions.
Lecture 3 4
- 1. CS212 亠弍 亰仂亳仂仄亢亳亶仆 勵仆亟 舒亞: . 丐仍亞舒
- 2. 亠从 3,4 HTML 从仂亟亳仍仂仍 丱勵仆亞, 亢舒亞舒舒仍, 仂仄
- 3. 丱勵仆亞 <table> ... </table> tag - 勵仆亞亳亶亞 仂亟仂仂亶仍亟仂亞 弍舒 仄唏勵勵亟 弍勵亟仆. <tr> </tr> 仄唏亳亶亞 仂亟仂仂亶仍仆仂 <td></td> 仄唏亳亶仆 唏亞唏亞亟唏仍 舒亞仍舒 亞. 亅仆 亞 亰舒亞 亠从 亞 仄 弍勵 唏仍亳亶仆 唏亞唏亞亟仍亳亶亞 仂仍亢 弍仂仍仆仂. 丱勵仆亞 弍仂仍仂仆 勵勵仆亳亶 亳仆亢 舒仆舒亞 仂亟仂仂亶仍仂 丱勵仆亞亳亶仆 勵亞 舒舒亞亟仍舒仆 仍亟 border 亳仆亢 舒仆舒 亞舒 唏亞仆唏. Border 仂亟仂仂亶仍仂亞亟仂仂亞勵亶 于仍, 0 亞亢 仂亟仂仂亶仍仂亞亟仂仆 弍舒亶于舒仍 勵仆亞 勵亞勵亶 舒舒亞亟舒仆舒. 丱勵仆亞亳亶仆 仂仍亞仂亶亞 <th></th> 从仂亟仍仂仍仂仂 仂亟仂仂亶仍亟仂亞.
- 4. 丱勵仆亞亳亶仆 仆勵亟 仆亞亞: <th colspan></th> 舒亞舒仆 亟舒亞 仆勵亟 仆亞亞仆 <th rowspan></th> 唏亳亶仆 亟舒亞 仆勵亟 仆亞亞仆 丱勵仆亞亳亶仆 勵亞 仂亳仍舒: 丱勵仆亞亳亶仆 勵亞 仄亢亶 弍舒亶亞 <table border=/slideshow/lecture-3-4/5239822/> 亞亢 亰舒舒亢 唏亞亟唏亞. 亳 仆: <table border=/slideshow/lecture-3-4/5239822/0></table> 仆 仆 勵仆亞亳亶仆 礆舒 勵亞勵亶 亞亢 亰舒舒亢 唏亞亢 弍舒亶仆舒.
- 5. 丱勵仆亞亳亶仆 仆勵亟仆亳亶 仄亢亞 仂亳仍舒: cellpadding =/slideshow/lecture-3-4/5239822/ 勵仍勵勵 勵亞 舒亳亞仍舒仆 仂亳仍仆舒. 仆: <table border=/slideshow/lecture-3-4/5239822/ 1 cellpadding=/slideshow/lecture-3-4/5239822/10 > 丱于 仆勵亟仆亳亶 仄亢亞 仂亳仍舒舒亞勵亶 弍仂仍 弍舒亰亠 唏唏唏唏 舒于仂仄舒舒舒 舒舒亢 舒于仆舒. 丱于 仂亳仍舒仆 弍仂仍 仂亳仍舒仆 仄亢仆亟 舒于仆舒. 丱于 仂亳仍舒仆 仄亢仆 于仍 弍舒亰亠 舒于仂仄舒舒舒 舒舒亢 舒于仆舒.
- 6. 唏仆 亞舒亟仆舒 勵仆亟 仆勵亟仆亳亶 仄亢亞 舒舒仆亞亶亞舒舒 唏唏亳仍亢 弍仂仍亟仂亞: Cellspacing =/slideshow/lecture-3-4/5239822/ 勵仍勵勵 勵亞亳亶亞 舒亳亞仍舒仆舒. 仆: <table border=/slideshow/lecture-3-4/5239822/1 cellspacing="10"> 丱勵仆亞亳亶仆 舒仆 亟于亞 唏仆亞亳亶亞 唏唏仍唏: bgcolor=/slideshow/lecture-3-4/5239822/ 勵仍勵勵 勵亞亳亶亞 舒亳亞仍舒仆舒: 仆: <table border="1" bgcolor="yellow">
- 7. 丱勵仆亞亳亶仆 亟于亞 仆 亰舒亞 仂仍舒: Background=/slideshow/lecture-3-4/5239822/ 勵仍勵勵 勵亞亳亶亞 舒亳亞仍舒仆舒. 仆: <table border="1" background=/slideshow/lecture-3-4/5239822/picture.jpg > 丱勵仆亞亳亶仆 唏亞唏亞亟仍亳亶亞 亰亞勵勵仍: align=/slideshow/lecture-3-4/5239822/ 勵仍勵勵 勵亞亳亶亞 舒亳亞仍舒仆舒. 于舒 亞舒 仆: left, right, center 仆: <th align="left"></th> <td align=/slideshow/lecture-3-4/5239822/left"> </td>
- 8. 箪達箪箪単 樽谷樽鱈 狸尊丹 叩樽谷樽鱈 叩達鱈短達 鱈箪達嘆達箪鱈 尊達尊達辰尊谷 樽丹坦坦谷探 脱竪淡箪箪 <html> <body> <h4>樽存丹 叩達鱈短達 鱈箪達嘆達箪単箪鱈:</h4> <table border="1"> <tr><th>箪丹</th><th colspan="2">嘆単</th> <! 2 叩達鱈短達 鱈箪達嘆達箪単箪鱈 鱈端-> </tr><tr> <td>Bill Gates</td> <td>555 77 854</td><td>555 77 855</td> </tr></table>
- 9. <h4>樽存丹 狸尊丹竪辿達 鱈箪達嘆達箪単箪鱈 :</h4><table border="1"> <tr> <th>箪丹:</th> <td>Bill Gates</td></tr> <tr> <th rowspan="2">嘆単:</th> <! 2狸尊丹竪辿達 鱈箪達嘆達箪単箪鱈 鱈端-> <td>555 77 854</td></tr> <tr> <td>555 77 855</td></tr> </table></body> </html>
- 10. <table> 丱勵仆亞亳亶亞 仂亟仂仂亶仍仆仂 <tr> 丱勵仆亞亳亶仆 仂仍亞仂亶 仂亟仂仂亶仍仂仆仂 <th> 丱勵仆亞亳亶仆 仄唏 仂亟仂仂亶仍仆仂 <td> 丱勵仆亞亳亶仆 唏亞唏亞亟唏仍 仂亟仂仂亶仍仆仂 <caption> 丱勵仆亞亳亶仆 亞舒亳亞 仂亟仂仂亶仍仆仂 <colgroup> 舒亞舒仆舒 仆亞亞亳亶亞 亰舒舒仆舒, 仂亟仂仂亶仍仆仂 <col> 舒亞舒仆 亳仆亢 舒仆舒亞 仂亟仂仂亶仍仆仂 <thead> 丱勵仆亞亳亶仆 仂仍亞仂亶亞 仂亟仂仂亶仍仆仂 <tbody> 丱勵仆亞亳亶仆 亳 弍亳亠亳亶亞 仂亟仂仂亶仍仆仂 <tfoot> 丱勵仆亞亳亶仆 唏亞亞唏仍亳亶亞 仂亟仂仂亶仍仆仂
- 11. HTML List 亅仄弍仍亞亟亞勵亶 亢舒亞舒舒仍 <ul> tag- 仂亟仂仂亶仍亟仂亞. 于仍仆 舒 亟亞舒亶 仄亟亞仍亞 舒亳亞仍舒亟舒亞. <li> tag- 亢舒亞舒舒仍仆 仍亠仄亠仆亳亶亞 仂亟仂仂亶仍仆仂. <ul> tag- 仆 type 舒舒 亢舒亞舒舒仍仆 仄亟亞仍亞亞 唏唏亳仍亢 弍仂仍亟仂亞. 亳 仆: <ul type=/slideshow/lecture-3-4/5239822/disk> <ul type=/slideshow/lecture-3-4/5239822/circle> <ul type=/slideshow/lecture-3-4/5239822/square>
- 12. 亅仄弍仍亞亟仆 亢舒亞舒舒仍 <ol> tag- 仂亟仂仂亶仍仆仂. 亞舒舒 仄亟亞 亟勵仍亞亟仆. <li> tag- 亢舒亞舒舒仍仆 仍亠仄亠仆亳亶亞 仂亟仂仂亶仍仆仂亶 <ol> tag- 仆 type 舒舒 亢舒亞舒舒仍仆 仄亟亞仍亞亞 唏唏亳仍亢 弍仂仍亟仂亞. 亳 仆: <ol type=/slideshow/lecture-3-4/5239822/A> <ol type=/slideshow/lecture-3-4/5239822/a>; <ol type=/slideshow/lecture-3-4/5239822/I> <ol type=/slideshow/lecture-3-4/5239822/i>;
- 13. 丐仂亟仂仂亶仍仂仍仆 亢舒亞舒舒仍 亅仆 仆 亢舒亞舒舒仍 弍亳 仂仄仂仍仍仆 舒亶仍弍舒仆 亢舒亞舒舒仍 ﾐ. <dl> tag- 仂亟仂仂亶仍仆仂 <dt> tag- 仂仄仂仍仆仂 <dd> tag- 舒亶仍弍舒亞 弍亳仆
- 14. 達単谷嘆鱈 辰樽嘆樽丹 辰探竪鱈 脱達単谷嘆 多多単達箪 仆 亢亳: <html> <body> <h4>達単谷嘆短鱈 辰樽嘆樽丹 脱達単谷嘆 多多単達箪脱 叩樽谷鱈樽:</h4> <ul><li>樽担奪</li><li>辿 <ul><li>丹 旦辿</li><li>樽達樽樽鱈 旦辿</li> </ul></li><li>多多</li></ul> </body> </html>
- 15. 達単谷嘆短鱈 棚樽辰歎谷樽谷坦坦辰 樽辰歎谷樽谷 辿谷叩丹 <ol> 丹箪狸叩箪谷箪達辰単箪鱈 脱達単谷嘆 嘆樽辰樽丹探樽辿谷鱈樽. <ul> 丹箪狸叩箪谷箪達辰箪箪達多辿 脱達単谷嘆 嘆樽辰樽丹探樽辿谷鱈樽. <li> 達単谷嘆 嘆樽辰樽丹探樽辿谷鱈樽. <dl> 樽辰樽丹探樽辿谷樽谷嘆短鱈 脱達単谷嘆 嘆樽辰樽丹探樽辿谷鱈樽. <dt> 樽狸炭存樽谷樽谷. <dd> 樽狸炭存樽谷樽谷 短鱈 嘆辿谷叩丹. <dir> <ul>-竪辿鱈 樽丹樽鱈辰 探箪丹箪達谷箪脱 叩樽谷鱈樽. <menu> <ul>-竪辿鱈 樽丹樽鱈辰 探箪丹箪達谷箪脱 叩樽谷鱈樽.
- 16. HTML FORM 奪棚単嘆 嘆谷叩丹 (type="text") 丱亞仍亞 亠从仆 唏亞唏亞亟唏仍 仂仍舒舒亟 亰仂亳仍舒亞亟舒仆 亠从 舒仍弍舒. 仆亟舒亞 亞舒 (default) 仆 20 仄亟亞 弍舒亶仆舒. 丱亟舒 亟亟舒亞亟舒 勵 亠亟 亞 舒仍弍舒 仆 仂仂仂仆 弍舒亶仆舒. 丱舒亳仆 Value 亳仆亢 - 舒仆舒仆 仍舒仄亢舒亶亞舒舒 舒仆亟舒亞 亞亞 仂仍亞仂亢 弍仂仍仆仂. 亳 亳亞亟 仍弍: <input type="text" name="text3" value=/slideshow/lecture-3-4/5239822/ 仆亟舒亞 + 亞舒">
- 17. Size 亳仆亢 舒仆舒: Size 仆 亠从 仂仍舒 舒仍弍舒仆 亞 仂亟仂仂亶仍仆仂. 亳亳亞亟 仍弍: <input type=/slideshow/lecture-3-4/5239822/text name=/slideshow/lecture-3-4/5239822/text1 size=/slideshow/lecture-3-4/5239822/30> Maxlength 亳仆亢 舒仆舒 丐舒仍弍舒 仂仍舒 仄亟亞亳亶仆 仂仂亞 Maxlength 亳仆亢 舒仆舒仆 亞舒舒 磶亞舒舒仍舒 弍仂仍仂仄亢仂亶. 亳亳亞亟 仍弍: <input type=/slideshow/lecture-3-4/5239822/text name=/slideshow/lecture-3-4/5239822/text size=/slideshow/lecture-3-4/5239822/30 maxlength=/slideshow/lecture-3-4/5239822/20>
- 18. 勵亞 仂仍舒 舒仍弍舒 (type=/slideshow/lecture-3-4/5239822/password) 奪棚単嘆 嘆谷叩丹嘆辿 竪脱竪谷 嘆奪棚単嘆 樽丹坦坦谷探辰 淡竪達谷達辰探 叩樽谷樽但 探箪丹箪達谷箪達 竪辿鱈 樽丹坦坦谷脱 叩坦辿 嘆箪狸辰箪達嘆 勵勵 辰 "bullet" (*)嘆箪狸辰箪達嘆箪箪丹 叩竪 竪達辰箪鱈箪 . 竪 竪達辰箪探 探箪谷叩箪丹 : <input type="password" name="pass1/slideshow/lecture-3-4/5239822/ size=/slideshow/lecture-3-4/5239822/20" maxlength="10 value=/slideshow/lecture-3-4/5239822/ 勳亞仍舒 >
- 19. 仍仂仆 仄唏 亠从 仂仍舒 (type=/slideshow/lecture-3-4/5239822/textarea) 亞 仂仍仂仆 仄唏 亠从 仂仍舒舒亟 舒亳亞仍舒亞亟舒仆舒. 丱亞仍亞 亠从 仂仍舒舒亟 舒于仂仄舒舒舒 Scroll 勵勵仆. Rows : 仆 textarea 舒仍弍舒仆 ( 仄唏唏唏 ) Cols : 仆 textarea 舒仍弍舒仆 唏亞唏仆 ( 仄亟亞 ) WRAP : Virtual 亞舒舒亶 弍仂仍 仂仍亢 弍亶 亠从 亰勵勵仆 亞舒 舒仍 亰亞勵勵仍仍 亳亶亞亟仆. 亳亳亞亟 仍弍: <textarea=/slideshow/lecture-3-4/5239822/comments rows=/slideshow/lecture-3-4/5239822/6 cols=/slideshow/lecture-3-4/5239822/60 wrap=/slideshow/lecture-3-4/5239822/virtual </textarea>
- 20. Radio button (type="radio") 丱仂仂仂仆亟仂仂 舒仄舒舒舒仍 弍 勵 亳亶 仂仆亞仂仍仆 仂于 . 丕亞 仂仆亞仂仍仆 弍舒亞舒舒 亰 唏 于 唏 仆 仆亞亳亶亞 仆 仍 仂仆亞仂 弍仂仍仂仄亢仂亶. 丱于 仆亞 radio button-r 仂仆亞仂于仂仍 唏 仄仆 唏 仂仆亞仂亞亟仂仆 弍舒亶舒仆 仆 舒于仂仄舒舒舒 仂仆亞仂仍亞 勵亶 弍仂仍仆仂. 舒亞 RadioButton- 亞 仂亟仂仂亶仍仂仆 仍亟 弍 勵 亞亟亳亶仆 仆 name 亳仆亢 舒仆舒 亳亢亳仍 亞舒 仂仍亞仂 亞亶. CHECKED 亳仆亢 舒仆舒 仆 亟舒 亟亟舒亞亟舒舒亟 仂仆 亞 仂亞亟仂仆 弍舒亶 radiobutton- 亞 仂亟仂仂亶仍仆仂.
- 21. 亳亳亞亟 仍弍: <input type="radio" name=/slideshow/lecture-3-4/5239822/ rdButton" value=/slideshow/lecture-3-4/5239822/rd1" checked> radio button1 <br> <input type="radio" name="rdButton" value=/slideshow/lecture-3-4/5239822/rd2"> radio button2 <br>
- 22. Check Boxes (type= checkbox ) Radio button-仂亶 亳亢亳仍 仂仆亞仂仍仆 仂于 . 亊仍亞舒舒 仆 弍舒亟 仂于 仆仂仂仂仂 舒仄舒舒舒仍亞 勵 亶亞 仂仆亞仂亞亟仂 弍仂仍仂仄亢仂亶. 哦唏唏唏 仍弍仍, 弍舒亞 仂于 仆亟舒舒 亟亳亶亞 仆 - 仂仆亞仂亢 仄亟亞仍 弍仂仍仂仄亢仂亶 ﾐ. Checkbox 弍 勵 唏唏 唏唏 仆亶 弍舒亶仆舒. 弍 仂 仄 亳仍亞亞亟 亞舒 仆 仂仆亞仂亞亟仂仆 checkbox-亟仆 value 亞舒 弍舒亶仆舒. CHECKED 亳仆亢 舒仆舒 仆 亟舒 亟亟舒亞亟舒舒亟 仂仆亞仂亞亟仂仆 弍舒亶 checkbox-r 仂亟仂仂亶仍仆仂.
- 23. 亳亳亞亟 仍弍: <input type="checkbox" name=/slideshow/lecture-3-4/5239822/chk1" value=/slideshow/lecture-3-4/5239822/One" checked> <input type="checkbox" name=/slideshow/lecture-3-4/5239822/chk2" value=/slideshow/lecture-3-4/5239822/Two">
- 24. Menu Select (type="select") 弌仂仆亞仂仍仆 仆 亢舒亞舒舒仍舒舒 仂仆亞仂仍 亳亶 弍仂仍仂仄亢 仂仍亞仂亟仂亞. <OPTION>...</OPTION> tag 仆 亟 亞舒舒 亠从亳亶亞 仂亟仂仂亶仍仆仂. SELECTED 亳仆亢 舒仆舒 仆 亟舒 亟亟舒亞亟舒 勵亠亟 仂仆亞仂亞亟仂仆 弍舒亶 仍亠仄亠仆亳亶亞 仂亟仂仂亶仍仆仂. 丕亞 亳仆亢 舒仆舒亞 仂亟仂仂亶仍亢 唏亞唏唏亞勵亶 弍仂仍 default -p 仆亳亶 仍亠仄亠仆 仂仆亞仂亞亟仂仆 弍ﾑ 亳亟于亳亶 弍舒亶仆舒.
- 25. 亳亳亞亟 仍弍: <select name="lesson"> <option value=/slideshow/lecture-3-4/5239822/cs212"> cs212</option> <option value=/slideshow/lecture-3-4/5239822/cs211"> cs211</option> </select>
- 26. Submit (type=/slideshow/lecture-3-4/5239822/submit) 个仂仄亟 type=/slideshow/lecture-3-4/5239822/submit 亞亢 唏亞唏亞亟于唏仍 仂于 勵勵仆. 丕亞 仂于 亟 仂于亳仂亟 仂仄仆 舒亞仍亞亞 唏唏 舒亶仍 亳仍亞亟亞. Action 亳仆亢 舒仆舒 仆 亳仍亞 舒亶仍仆 仆亳亶亞 仂亟仂仂亶仍亟仂亞. 亳亳亞亟 仍弍: <form name="input" action="html_form_action.asp/slideshow/lecture-3-4/5239822/ method="get"> User name:<input type="text/slideshow/lecture-3-4/5239822/ name="user"> <input type="submit" value="仍亞"> </form>
- 27. Form 舒亳亞仍舒舒仆 亢亳: <html><body> <form action="MAILTO:someone@w3schools.com" method="post" enctype="text/plain"> <h3>鱈箪 Form 巽探竪達 W3Schools 竪谷達箪箪鱈箪.</h3> 箪丹:<br> <input type="text" name="name/slideshow/lecture-3-4/5239822/ value="鱈短 鱈箪丹" size="20"> <br> 坦坦辰鱈:<br> <input type="text" name="mail value="鱈短 淡坦坦辰鱈" size="20">
- 28. <br>辿谷叩丹:<br> <input type="text" name="comment" value="嘆鱈短 嘆辿谷叩丹" size="40"><br><br> <input type="submit" value="谷達箪箪探"> <input type="reset" value="探竪鱈 歎谷探"> </form> </body> </html>
- 29. 仂亟仍仂仍 丐舒亶仍弍舒 <form> 丱亞仍亞亳亶仆 仂仍亞亞 仂亟仂仂亶仍仆仂 <input> 仍舒 舒仍弍舒 仂亟仂仂亶仍仂 <textarea> 丐亠从 舒仍弍舒 仂亟仂仂亶仍仂 <label> 仂亟仂仂亶仍仂 <fieldset> 丐舒仍弍舒仆 仂亳仍亞亞 仂亟仂仂亶仍仂 <legent> 丐舒仍弍舒 亞舒亳亞 唏亞 勵勵仆亳亶亞 勵仍仆 <select> 丐仄亟亞仍 亢舒亞舒舒仍 勵勵亞仆 <opt group> 弌仂仆亞仂仍仆 弍舒亞亞 仂亟仂仂亶仍仆仂 <option> 弌仂仆亞仂仍亞 亢舒亞舒舒仍舒舒 仂亟仂仂亶仍仆仂 <button> 丐仂于 仂亟仂仂亶仍仆仂 <insidex> <input> -仆 仂仂仆亟 亞仍亢 弍仂仍仆仂
- 30. <img> tag <img> tag 舒亳亞仍舒仆 唏亟唏仍亞唏唏仆 弍仂仍仂仆 唏亟唏仍亞唏唏仆亞勵亶 弍勵 唏仍亳亶仆 亰亞亳亶亞 仂仍亢 弍仂仍仆仂. 丐勵勵仆亳亶 亳仆亢 舒仆舒 亰亞亳亶仆 舒亶仍仆舒舒 亰舒仄亞 亰舒舒亢 唏亞仆唏. 亳亳亞亟 仍弍 仆 : <img src=/slideshow/lecture-3-4/5239822/ 亰亞亳亶仆 舒亶仍仆舒舒 亰舒仄 > 唏仆 亰亞亳亶仆 舒亶仍仆舒舒 仄亢亞 亰舒舒仆 唏亞亢 弍仂仍仆仂. <img src=/slideshow/lecture-3-4/5239822/ 亰亞亳亶仆 舒亶仍仆 亰舒仄 width 唏亞唏仆 hight 唏仆亟唏 >
- 31. <img> tag- 仆 align 亳仆亢 舒仆舒 Align 亳仆亢 舒仆舒亞 舒亳亞仍舒仆 亰亞舒舒 勵仆 弍舒亶仍舒仍亟舒舒 仂仍舒 弍仂仍仂仄亢仂亶. 唏仆 亠亳亶仆 舒仄 亰亞勵勵仍仍 亳亶 弍仂仍仂仄亢仂亶. A 于舒 亞亟 仆: /slideshow/lecture-3-4/5239822/ Top, Bottom, Middle, Left, Center, Right 亳亳亞亟 仍弍: <img src=/slideshow/lecture-3-4/5239822/ 亰亞亳亶仆 亰舒仄 align=/slideshow/lecture-3-4/5239822/ 弍舒亶仍舒仍 width=/slideshow/lecture-3-4/5239822/ 唏亞唏仆 hight=/slideshow/lecture-3-4/5239822/ 唏仆亟唏 >