intTypePromotion=1
zunia.vn Tuyển sinh 2024 dành cho Gen-Z zunia.vn zunia.vn
ADSENSE
 » 
 » 

BÀI TẬP HTML

Chia sẻ: Nguyễn Thành Trung | Ngày: | Loại File: DOC | Số trang:33

Thêm vào BST
Báo xấu
582
lượt xem 161
download
 
  Download Vui lòng tải xuống để xem tài liệu đầy đủ

TÀI LIỆU THAM KHẢO - BÀI TẬP HTML

Chủ đề:

Bình luận(0) Đăng nhập để gửi bình luận!

Lưu

Nội dung Text: BÀI TẬP HTML

  1. Create by TrungNT EXAMPLES FOR HTML COURSE Create by mrtblack From : www.w3schools.com VP, 22-07-11 Table of contents : Basic Tags A very simple HTML document...........................................................................................................................................4 How text inside paragraphs is displayed More paragraphs The use of line breaks Poem problems (some problems with HTML formatting) Heading tags Center aligned heading Insert a horizontal rule Comments in the HTML source Add a background color........................................................................................................................................................5 Add a background image Formatting Text Text formatting Preformatted text (how to control line breaks and spaces) Different computer-output tags Insert an address....................................................................................................................................................................6 Abbreviations and acronyms Long and short quotations How to mark deleted and inserted text .................................................................................................................................7 Links How to create hyperlinks Set an image as a link............................................................................................................................................................8 Open a link in a new browser window Jump to another part of a document (on the same page) Break out of a frame............................................................................................................................................................10 How to link to a mail message (will only work if you have mail installed) Frames How to create a vertical frameset with 3 different documents ...........................................................................................11 How to create a horizontal frameset with 3 different documents How to mix a frameset in rows and columns ......................................................................................................................12 How to create a navigation frame Inline frame (a frame inside an HTML page).....................................................................................................................13 Jump to a specified section within a frame Jump to a specified section with frame navigation ............................................................................................................14 KTCN-CTT
  2. Create by TrungNT Tables Simple tables Different table borders.........................................................................................................................................................15 Table with no borders Headings in a table..............................................................................................................................................................16 Empty cells Table with a caption............................................................................................................................................................17 Table cells that span more than one row/column ................................................................................................................18 Tags inside a table...............................................................................................................................................................19 Cell padding (control the white space between cell content and the borders Cell spacing (control the distance between cells) Add a background color or a background image to a table................................................................................................20 Add a background color or a background image to a table cell.........................................................................................21 Align the content in a table cell The new frame attribute Lists An unordered list.................................................................................................................................................................22 An ordered list.....................................................................................................................................................................23 Different types of ordered lists Different types of unordered Lists......................................................................................................................................24 Nested list Nested list 2.........................................................................................................................................................................25 Definition list Forms and Input How to create input fields...................................................................................................................................................26 Password fields Checkboxes Radiobuttons........................................................................................................................................................................27 Simple drop-down box (a selectable list) Another drop-down box with a pre-selected value Textarea (a multi-line text input field) Create a button Draw a border with a caption around data Form with an input field and a submit button.....................................................................................................................28 Form with checkboxes and a submit button Form with radiobuttons and a submit button Send a mail from a form .....................................................................................................................................................29 Images Insert images Insert images from another folder or another server Align an image within a text...............................................................................................................................................30 Let the image float to the left/right of a paragraph.............................................................................................................31 Adjust images to different sizes..........................................................................................................................................32 Display an alternate text for an image (if the browser can't load images) Make a hyperlink of an image Create an image-map, with click-able regions Backgrounds KTCN-CTT
  3. Create by TrungNT Good background and text color Bad background and text color Good background image Good background image 2 Bad background image Styles Styles in the head section of an HTML document ..............................................................................................................33 Link that is not underlined..................................................................................................................................................34 Link to an external style sheet The Head Section Set a title of a document One target for all links on a page The Meta Tag Document description Document keywords Redirect a user to another URL ............................................................................................................................................................................35 KTCN-CTT
  4. Create by TrungNT 1. A very simple HTML document The content of the body element is displayed in your browser. 2. How text inside paragraphs is displayed This is a paragraph. This is a paragraph. This is a paragraph. Paragraph elements are defined by the p tag. 3. The use of line breaks To breaklinesin aparagraph,use the br tag. 4. Heading tags This is heading 1 This is heading 2 This is heading 3 This is heading 4 This is heading 5 This is heading 6 Use heading tags only for headings. Don't use them just to make something bold. Use other tags for that. 5. Add a background color KTCN-CTT
  5. Create by TrungNT Look: Colored Background! 6. Text formatting This text is bold This text is strong This text is big This text is bold This text is emphasized This text is italic This text is small This text contains subscript This text contains superscript This text is strong This text is big This text is emphasized 7. Insert a horizontal rule The hr tag defines a horizontal rule: The hr tag defines a horizontal rule: This is a paragraph This is a paragraph This is a paragraph This is a paragraph This is a paragraph This is a paragraph 8. Insert an address Donald Duck BOX 555 KTCN-CTT
  6. Create by TrungNT Disneyland USA Donald Duck BOX 555 Disneyland USA 9. How to create hyperlinks This text is a link to a page on this Web site. This text is a link to a page on the World Wide Web. This text is a link to a page on this Web site. This text is a link to a page on the World Wide Web. 10. Preformatted text (how to control line breaks and spaces) This is preformatted text. It preserves both spaces and line breaks. This is The pre tag is good for displaying computer preformatted text. code: It preserves both spaces and line breaks. for i = 1 to 10 print i next The pre tag is good for displaying computer code: for i = 1 to 10 print i KTCN-CTT
  7. Create by TrungNT next i 11. How to mark deleted and inserted text a dozen is twelve pieces Most browsers will overstrike deleted text and underline inserted text. a dozen is twenty Some older browsers will display deleted twelve or inserted text as plain text. pieces Most browsers will overstrike deleted text and underline inserted text. Some older browsers will display deleted or inserted text as plain text. 12. Set an image as a link You can also use an image as a link: You can also use an image as a link: 13. Open a link in a new browser window Last Page KTCN-CTT
  8. Create by TrungNT Last Page "_blank", the link will open in a new window. If you set the target attribute of a link to "_blank", the link will open in a new window. 14. Jump to another part of a document (on the same page) See also Chapter 4. Chapter 1 This chapter explains ba bla bla See also Chapter 4. Chapter 2 This chapter explains ba bla bla Chapter 1 This chapter explains ba bla bla Chapter 3 Chapter 2 This chapter explains ba bla bla This chapter explains ba bla bla Chapter 4 Chapter 3 This chapter explains ba bla bla This chapter explains ba bla bla Chapter 4 This chapter explains ba bla bla Chapter 5 Chapter 5 This chapter explains ba bla bla This chapter explains ba bla bla Chapter 6 Chapter 6 This chapter explains ba bla bla This chapter explains ba bla bla Chapter 7 This chapter explains ba bla bla Chapter 7 Chapter 8 This chapter explains ba bla bla This chapter explains ba bla bla Chapter 9 KTCN-CTT
  9. Create by TrungNT This chapter explains ba bla bla Chapter 8 Chapter 10 This chapter explains ba bla bla This chapter explains ba bla bla Chapter 11 Chapter 9 This chapter explains ba bla bla Chapter 12 This chapter explains ba bla bla This chapter explains ba bla bla Chapter 10 Chapter 13 This chapter explains ba bla bla This chapter explains ba bla bla Chapter 14 Chapter 11 This chapter explains ba bla bla Chapter 15 This chapter explains ba bla bla This chapter explains ba bla bla Chapter 12 Chapter 16 This chapter explains ba bla bla This chapter explains ba bla bla Chapter 17 Chapter 13 This chapter explains ba bla bla This chapter explains ba bla bla Chapter 14 This chapter explains ba bla bla Chapter 15 This chapter explains ba bla bla Chapter 16 This chapter explains ba bla bla Chapter 17 This chapter explains ba bla bla 15. Break out of a frame KTCN-CTT
  10. Create by TrungNT Locked in a frame? Click here! Locked in a frame? Click here! 16. How to link to a mail message (will only work if you have mail installed) This is a mail link: Send Mail Note: Spaces between words should be replaced by %20 to ensure that the browser will display your text properly. This is a mail link: Send Mail Note: Spaces between words should be replaced by %20 to ensure that the browser will display your text properly. 17. How to create a vertical frameset with 3 different documents KTCN-CTT
  11. Create by TrungNT 18. How to create a horizontal frameset with 3 different documents 19. How to mix a frameset in rows and columns KTCN-CTT
  12. Create by TrungNT 20. How to create a navigation frame 21. Inline frame (a frame inside an HTML page) KTCN-CTT
  13. Create by TrungNT Some older browsers don't support iframes. If they don't, the iframe will not be visible. 22. Jump to a specified section within a frame 23. Jump to a specified section with frame navigation KTCN-CTT
  14. Create by TrungNT 24. Simple tables Each table starts with a table tag. Each table row starts with a tr tag. Each table data starts with a td tag. One column: Each table starts with a table tag. Each table row starts with a tr tag. 100 Each table data starts with a td tag. One row and three columns: One column: 100 200 300 100 Two rows and three columns: 100 200 300 400 500 600 One row and three columns: 100 200 300 Two rows and three columns: KTCN-CTT
  15. Create by TrungNT 100 200 300 400 500 600 25. Different table borders With a normal border: First Row With a normal border: Second Row With a thick border: First Row First Row Second Row Second Row With a very thick border: First Row With a thick border: Second Row First Row Second Row With a very thick border: First KTCN-CTT
  16. Create by TrungNT Row Second Row 26. Headings in a table Table headers: Name Telephone Telephone Table headers: Bill Gates 555 77 854 555 77 855 Vertical headers: Name Telephone Telephone First Name: Bill Gates Telephone: 555 77 854 Telephone: 555 77 855 Bill Gates 555 77 854 555 77 855 Vertical headers: First Name: Bill Gates Telephone: 555 77 854 Telephone: 555 77 855 KTCN-CTT
  17. Create by TrungNT 27. Table with a caption This table has a caption, and a thick border: My Caption 100 200 300 This table has a caption, 400 500 600 and a thick border: My Caption 100 200 300 400 500 600 28. Table cells that span more than one row/column Cell that spans two columns: Name Telephone Cell that spans two columns: Bill Gates 555 77 854 555 77 855 Cell that spans two rows: Name Telephone First Name: Bill Gates 555 77 854 Bill Gates Telephone: 555 77 855 555 77 854 555 77 855 Cell that spans two rows: First Name: KTCN-CTT
  18. Create by TrungNT Bill Gates Telephone: 555 77 854 555 77 855 29. Tags inside a table This cell contains a table: This is a paragraph AB This is another paragraph C D This cell contains a list This is a paragraph apples • HELLO This is another paragraph bananas • This cell contains a table: pineapples • A B C D This cell contains a list apples bananas pineapples HELLO KTCN-CTT
  19. Create by TrungNT 30. Cell padding (control the white space between cell content and the borders Without cellpadding: First Row Without cellpadding: Second Row With cellpadding: First Row First Row Second Second Row Row With cellpadding: First Row Second Row 31. Add a background color or a background image to a table A background color: First Row A background color: Second Row A background image: First Row First Row Second Row KTCN-CTT
  20. Create by TrungNT Second Row A background image: First Row Second Row 32. Add a background color or a background image to a table cell Cell backgrounds: First Row Cell backgrounds: Second Row First Row Second Row 33. Align the content in a table cell Money spent on.... January February Clothes $241.10 $50.20 Make-Up $30.00 $44.45 KTCN-CTT
ADSENSE

CÓ THỂ BẠN MUỐN DOWNLOAD

THÔNG TIN
TRỢ GIÚP
HỖ TRỢ KHÁCH HÀNG
Theo dõi chúng tôi

Chịu trách nhiệm nội dung:

Nguyễn Công Hà - Giám đốc Công ty TNHH TÀI LIỆU TRỰC TUYẾN VI NA

LIÊN HỆ

Địa chỉ: P402, 54A Nơ Trang Long, Phường 14, Q.Bình Thạnh, TP.HCM

Hotline: 093 303 0098

Email: support@tailieu.vn

Giấy phép Mạng Xã Hội số: 670/GP-BTTTT cấp ngày 30/11/2015 Copyright © 2022-2032 TaiLieu.VN. All rights reserved.

 

Đồng bộ tài khoản
2=>2