Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
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

1,008 views

Published on

  • Be the first to comment

  • Be the first to like this

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

×