Các thẻ cơ bản

         Chương 2
Mục tiêu
   Dùng các thẻ cơ bản
   Chèn hình ảnh vào tài liệu HTML




                                Web Pa...
Các phần tử HTML cơ bản
   Thẻ tiêu đề (H1 đến H6)
   Thẻ mức đoạn
   Thẻ khối
   Thẻ định dạng ký tự...
Tiêu đề
<HTML>
   <HEAD>
       <TITLE>Introduction to HTML</TITLE>
   </HEAD>
   <H1>Introduction to HTML</H1>
   <H2>In...
Sử dụng tiêu đề




                     Web Page Programming with HTML,DHTML & JavaScript/Session 2/ 5 of 22
Thẻ <Address>
Nó có thể chứa một hoặc một số phần sau:

   Liên kết đến trang chủ

   Đặc tính chuỗi tì...
Thẻ <Address> [Ví dụ]
<HTML>
   <HEAD>
         <TITLE>Welcome to HTML</TITLE>
   </HEAD>
   <BODY BGCOLOR = lavender>
...
Cấu trúc văn bản
   Sử dụng trích dẫn
     <BLOCKQUOTE >



   Văn bản được định dạng trước.
     <PRE>


...
Định dạng
   Thẻ định dạng mức vật lý
   Thẻ định dạng mức logic




                                Web Pag...
Thẻ định dạng mức vật lý
   <B> . . . </B>
   <TT> . . . </TT>
   <SUP> . . . </SUP>
   <SUB> . . . </SUB>




 ...
Thẻ định dạng mức logic
   <EM> . . </EM>
   <CODE>. . . </CODE>
   <VAR>. . . </VAR>
   <CITE>. . . </CITE>




 ...
Danh sách
   Danh sách không thứ tự
   Danh sách có thứ tự
   Danh sách định nghĩa




                          ...
Danh sách không thứ tự
<HTML>
   <HEAD>
       <TITLE>Learning HTML</TITLE>
   </HEAD>
   <BODY>
       <UL>
            ...
Chọn kiểu Bullet
   <LI TYPE = SQUARE> bullets hình vuông

   <LI TYPE = DISC> bullets hình đĩa

   <LI TYPE = CIR...
Danh sách có thứ tự
<HTML>
  <HEAD>
      <TITLE>Learning HTML</TITLE>
  </HEAD>
  <BODY>
      <OL>
            <LI>Mond...
Chọn kiểu đánh số
   Upper Roman
        <LI TYPE = I>
   Lower Roman
        <LI TYPE = i>
   Uppercase
       ...
Danh sách định nghĩa
<HTML>
   <HEAD>
        <TITLE>Learning HTML</TITLE>
   </HEAD>
   <BODY>
        <DL>
          ...
Đường kẻ ngang
    Thuộc tính của <HR>
       align

       width

       size

       noshade




             ...
Sử dụng thẻ Font
   <FONT> … </FONT>
     Color

     Size

     Face




                       Web Page Programmi...
Thêm màu
<HTML>
      <HEAD>
           <TITLE>Learning HTML</TITLE>
      </HEAD>
      <BODY BGCOLOR=lavender>
        ...
Ảnh trong tài liệu HTML
   Ảnh GIF (Graphics Interchange Format)
    (.GIF)
      Định dạng GIF xen kẽ

      Ả...
Chèn ảnh
   <IMG SRC=”URL”>
   <IMG ALIGN=position SRC=”PICTURE.GIF”>
   <IMG SRC=Flowers.jpg ALT=”Beautiful
    Flow...
Upcoming SlideShare
Loading in …5
×

Session 02 Final

985 views
859 views

Published on

0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
985
On SlideShare
0
From Embeds
0
Number of Embeds
107
Actions
Shares
0
Downloads
19
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Session 02 Final

  1. 1. Các thẻ cơ bản Chương 2
  2. 2. Mục tiêu  Dùng các thẻ cơ bản  Chèn hình ảnh vào tài liệu HTML Web Page Programming with HTML,DHTML & JavaScript/Session 2/ 2 of 22
  3. 3. Các phần tử HTML cơ bản  Thẻ tiêu đề (H1 đến H6)  Thẻ mức đoạn  Thẻ khối  Thẻ định dạng ký tự  Danh sách  Đường kẻ ngang – Thẻ <HR>  Thẻ Font  Thẻ IMG Web Page Programming with HTML,DHTML & JavaScript/Session 2/ 3 of 22
  4. 4. Tiêu đề <HTML> <HEAD> <TITLE>Introduction to HTML</TITLE> </HEAD> <H1>Introduction to HTML</H1> <H2>Introduction to HTML</H2> <H3>Introduction to HTML</H3> <H4>Introduction to HTML</H4> <H5>Introduction to HTML</H5> <H6>Introduction to HTML</H6> </HTML> Web Page Programming with HTML,DHTML & JavaScript/Session 2/ 4 of 22
  5. 5. Sử dụng tiêu đề Web Page Programming with HTML,DHTML & JavaScript/Session 2/ 5 of 22
  6. 6. Thẻ <Address> Nó có thể chứa một hoặc một số phần sau:  Liên kết đến trang chủ  Đặc tính chuỗi tìm kiếm  Thông tin bản quyền Web Page Programming with HTML,DHTML & JavaScript/Session 2/ 6 of 22
  7. 7. Thẻ <Address> [Ví dụ] <HTML> <HEAD> <TITLE>Welcome to HTML</TITLE> </HEAD> <BODY BGCOLOR = lavender> <H3>My first HTML document</H3> <P>This is going to be real fun <H2>Using another heading</H2> <P> Another paragraph element <ADDRESS> <P><A href=”some address”>Click here to register for a free newsletter</A> </ADDRESS> </BODY> </HTML> Web Page Programming with HTML,DHTML & JavaScript/Session 2/ 7 of 22
  8. 8. Cấu trúc văn bản  Sử dụng trích dẫn  <BLOCKQUOTE >  Văn bản được định dạng trước.  <PRE>  Phần tử nhóm  <DIV>…</DIV>  <SPAN>…</SPAN> Web Page Programming with HTML,DHTML & JavaScript/Session 2/ 8 of 22
  9. 9. Định dạng  Thẻ định dạng mức vật lý  Thẻ định dạng mức logic Web Page Programming with HTML,DHTML & JavaScript/Session 2/ 9 of 22
  10. 10. Thẻ định dạng mức vật lý  <B> . . . </B>  <TT> . . . </TT>  <SUP> . . . </SUP>  <SUB> . . . </SUB> Web Page Programming with HTML,DHTML & JavaScript/Session 2/ 10 of 22
  11. 11. Thẻ định dạng mức logic  <EM> . . </EM>  <CODE>. . . </CODE>  <VAR>. . . </VAR>  <CITE>. . . </CITE> Web Page Programming with HTML,DHTML & JavaScript/Session 2/ 11 of 22
  12. 12. Danh sách  Danh sách không thứ tự  Danh sách có thứ tự  Danh sách định nghĩa Web Page Programming with HTML,DHTML & JavaScript/Session 2/ 12 of 22
  13. 13. Danh sách không thứ tự <HTML> <HEAD> <TITLE>Learning HTML</TITLE> </HEAD> <BODY> <UL> <LI>Monday <LI>Tuesday <LI>Wednesday <LI>Thursday <LI>Friday </UL> </BODY> </HTML> Web Page Programming with HTML,DHTML & JavaScript/Session 2/ 13 of 22
  14. 14. Chọn kiểu Bullet  <LI TYPE = SQUARE> bullets hình vuông  <LI TYPE = DISC> bullets hình đĩa  <LI TYPE = CIRCLE> bullets hình tròn Web Page Programming with HTML,DHTML & JavaScript/Session 2/ 14 of 22
  15. 15. Danh sách có thứ tự <HTML> <HEAD> <TITLE>Learning HTML</TITLE> </HEAD> <BODY> <OL> <LI>Monday <LI>Tuesday <LI>Wednesday <LI>Thursday <LI>Friday </OL> </BODY> </HTML> Web Page Programming with HTML,DHTML & JavaScript/Session 2/ 15 of 22
  16. 16. Chọn kiểu đánh số  Upper Roman  <LI TYPE = I>  Lower Roman  <LI TYPE = i>  Uppercase  <LI TYPE = A>  Lowercase  <LI TYPE = a>  Bắt đầu với một số khác 1  <OL START = n> [ Mặc định ] Web Page Programming with HTML,DHTML & JavaScript/Session 2/ 16 of 22
  17. 17. Danh sách định nghĩa <HTML> <HEAD> <TITLE>Learning HTML</TITLE> </HEAD> <BODY> <DL> <DT>Sunday <DD>The first day of the week <DT>HTML <DD>HyperText Markup Language <DT>Internet <DD>A network of networks </DL> </BODY> </HTML> Web Page Programming with HTML,DHTML & JavaScript/Session 2/ 17 of 22
  18. 18. Đường kẻ ngang  Thuộc tính của <HR>  align  width  size  noshade Web Page Programming with HTML,DHTML & JavaScript/Session 2/ 18 of 22
  19. 19. Sử dụng thẻ Font  <FONT> … </FONT>  Color  Size  Face Web Page Programming with HTML,DHTML & JavaScript/Session 2/ 19 of 22
  20. 20. Thêm màu <HTML> <HEAD> <TITLE>Learning HTML</TITLE> </HEAD> <BODY BGCOLOR=lavender> <H2><FONT COLOR = LIMEGREEN>Welcome to HTML</FONT></H2> <P><FONT COLOR = RED>This is good fun</FONT></P> </BODY> </HTML> Web Page Programming with HTML,DHTML & JavaScript/Session 2/ 20 of 22
  21. 21. Ảnh trong tài liệu HTML  Ảnh GIF (Graphics Interchange Format) (.GIF)  Định dạng GIF xen kẽ  Ảnh GIF trong suốt  Ảnh JPEG (Joint Photographic Expert Group) (.JPEG)  PNG (Portable Network Graphics) Web Page Programming with HTML,DHTML & JavaScript/Session 2/ 21 of 22
  22. 22. Chèn ảnh  <IMG SRC=”URL”>  <IMG ALIGN=position SRC=”PICTURE.GIF”>  <IMG SRC=Flowers.jpg ALT=”Beautiful Flowers”>  <BODY BACKGROUND=bgimage.gif>  <BODY BACKGROUND=bgimage.gif BGPROPERTIES=FIXED> Web Page Programming with HTML,DHTML & JavaScript/Session 2/ 22 of 22

×