Thứ Tư, 14 tháng 8, 2013

Thành phần của HTML

Khóa học lập trình web tại Nam Thăng Long mở ra nhằm giúp cho các bạn muốn lập web cho cá nhân, tổ chức , muốn kiếm tiền bằng nghề lập trình web , nhưng bây giờ bạn chưa có gì ngoài đam mê, bạn đã đúng khi chọn An Tâm Đức, hiện tại chúng tôi đang có các khóa học lập trình web php MYSQL , cũng như các khóa học lập trình web ASP.NET khóa lập trình web tĩnh để các bạn hiểu được cơ bản và cắt các template chuẩn seo 

cho dù các bạn có học khóa học nào đi nữa , thì bạn vẫn phải biết về HTML ,và đây là giáo trình cơ bản

CƠ BẢN VỀ CÁC THẺ HTML
Những thẻ quan trọng nhất trong HTML là những thẻ xác định Heading, đoạn văn và xuống dòng.
Headings
Headings được định dạng với hai thẻ <h1> đến <h6>. <h1> xác định heading lớn nhất. <h6> xác định heading nhỏ nhất
<h1>Đây là heading</h1>
<h2>Đây là heading</h2>
<h3>Đây là heading</h3>
<h4>Đây là heading</h4>
<h5>Đây là heading</h5>
<h6>Đây là heading</h6>

HTML sẽ tự động thêm một dòng trắng trước và sau mỗi heading.
Đoạn văn – paragraphs
Paragraphs được định dạng bởi thẻ <p>
<p>Đây là đoạn văn</p>
<p>Đây là một đoạn văn khác</p>

HTML sẽ tự động thêm một dòng trắng trước và sau mỗi heading.
Line Breaks – xuống dòng
Thẻ <br> được sử dụng khi bạn muốn kết thúc một dòng nhưng lại không muốn bắt đầu một đoạn văn khác. Thẻ <br> sẽ tạo ra một lần xuống dòng khi bạn viết nó.


<p>Đây <br> là một đoạn văn <br>với thẻ xuống hàng</p>

Thẻ <br> là một thẻ trống, nó không cần thẻ đóng dạng </br>

Lời chú thích trong HTML
Thẻ chú thích được sử dụng để thêm lời chú thích trong mã nguồn của HTML. Một dòng chú thích sẽ được bỏ qua bởi trình duyệt. Bạn có thể sử dụng chú thích để giải thích về code của bạn, để sau này bạn có phải quay lại chỉnh sửa gì thì cũng dễ nhớ hơn.
<!– Chú thích ở trong này –>

Bạn cần một dấu chấm than ! ngay sau dấu nhỏ hơn nhưng không cần ở dấu lớn hơn.

Những thẻ HTML cơ bản

Tag Mô Tả
<html> Xác định một văn bản dạng HTML
<body> Xác định phần thân của tài liệu
<h1> to <h6> Xác định header từ 1 đến 6
<p> Xác định một đoạn văn
<br> Chèn một dòng trắng
<hr> Xác định một đường thẳng
<!–> Xác định vùng chú thích

Một vài ví dụ

Các dạng của đoạn văn bản
  1. <!DOCTYPE html>
  2. <html>
  3. <body>
  4. <p>
  5. This paragraph
  6. contains a lot of lines
  7. in the source code,
  8. but the browser 
  9. ignores it.
  10. </p>
  11. <p>
  12. This paragraph
  13. contains      a lot of spaces
  14. in the source     code,
  15. but the    browser 
  16. ignores it.
  17. </p>
  18. <p>
  19. The number of lines in a paragraph depends on the size of your browser window. If you resize the browser window, the number of lines in this paragraph will change.
  20. </p>

  21. </body>
  22. </html>



nguồn : http://hocvietcode.eu5.org

Cấu trúc cơ bản của HTML

Khóa học lập trình web tại Nam Thăng Long cung cấp cho các học viên các khóa học lập trình web tĩnh html,css, jquery hoặc khóa học lập trình web PHP & MYSQL , ngoài ra còn các khóa khác như khóa học lập trình web trên ngôn ngữ ASP.NET  hay khóa học trên mã nguồn mở.
Dù bạn có tham gia khóa học nào đi nữa thì bạn vẫn phải biết cơ bản về cấu trúc của cấu trúc cơ bản của HTML

Trong bài viết này, chúng ta sẽ mổ xẻ một tài liệu HTML đơn giản để xem cấu trúc cơ bản của nó như thế nào.

Bạn hãy mở Notepad++ lên (hay bất kì trình soạn thảo nào tùy bạn). Trước tiên hãy lưu văn bản mà bạn đang mở với phần mở rộng là html, tên file bạn đặt gì cũng được. Sau đó bạn viết một đoạn code đơn giản như hình vào rồi Ctrl + S để lưu lại.

khóa học lập trình web

Cấu trúc cơ bản

Cấu trúc cơ bản của một tài liệu HTML bao gồm các thẻ. Các thẻ này thường mang một ý nghĩa nhất định và ảnh hưởng lên nội dung mà chúng bao quanh.

Một tài liệu HTML chuẩn chứa những phần cơ bản sau:
Phần DOCTYPE: khai báo kiểu văn bản. Nó cho trình duyệt biết bạn đang sử dụng phiên bản HTML nào. Đây là phần rất quan trọng nhưng lại thường bị bỏ qua trong nhiều tài liệu về nhập môn HTML. Có rất nhiều loại tài liệu khác nhau trên web, và một trình duyệt chỉ có thể hiển thị một tài liệu HTML chính xác 100% nếu nó biết phiên bản HTML nào mà tài liệu đó đang sử dụng. Phần khai báo DOCTYPE ở hình minh họa là của phiên bản HTML5.
Phần tiêu đề: bắt đầu bằng thẻ <head> và kết thúc bởi thẻ </head>. Phần này chứa tiêu đề mà được hiển thị trên thanh điều hướng của trang web. Tiêu đề là phần nội dung nằm giữa cặp thẻ <title> và </title>. Ngoài ra nó còn chứa một số khai báo khác, các thông tin phục vụ SEO mà chúng ta không đề cập ở đây.
Phần thân: nằm sau phần tiêu đề. Nó bao gồm văn bản, hình ảnh và các liên kết mà bạn muốn hiển thị trên trang web của mình. Phần thân bắt đầu bằng thẻ <body> và kết thúc với thẻ </body>.

Cả 2 phần tiêu đề và phần thân đều phải được nằm trong cặp thẻ <html> và </html>. Thẻ HTML báo cho trình duyệt biết nội dung giữa 2 thẻ này là một tài liệu HTML.

  1. <html>
  2. <body>
  3. <h1>This a heading</h1>
  4. <p>This is a paragraph.</p>
  5. <p>This is another paragraph.</p>
  6. </body>
  7. </html>
Bạn có thể tưởng tưởng mối quan hệ giữa các thành phần trong tài liệu HTML giống như một phả hệ vậy. Ta có thể nói các phần tử nằm bên trong là con của các phần tử bao ngoài và ngược lại, phần tử bao ngoài là cha của các phần tử bên trong. Như hình, phần tử p và h1 là đồng cấp với nhau, và cả hai là con của phần tử body. Phần tử html là cha của tất cả các phần tử khác.
Sử dụng comment

Cũng như mọi ngôn ngữ lập trình khác, comment – chú thích là phần không thể thiếu. Nó giúp bổ sung thông tin cho code, giúp code “dễ đọc”, dễ bảo trì hơn. Trong HTML, comment được sử dụng như sau: <!-- Nội dung chú thích -->. Ví dụ:<body> <!-- Thanh menu chính --> <div id="nav"> ..... </div> <!-- Nội dung chính --> <div id="content"> ..... </div> </body> 

Thực thi tài liệu HTML

Bạn đã có một tài liệu HTML đơn giản. Bạn muốn chạy nó để xem trình duyệt sẽ hiển thị nó như thế nào. Có nhiều cách để làm việc này. Đơn giản nhất thì bạn kéo thả file HTML vào khung trình duyệt đang mở. Hoặc bạn copy đường dẫn của nó trong máy tính vào ô địa chỉ của trình duyệt. Không thì phải chuột phải vào file HTML, chọn Open With, chọn trình duyệt mà bạn muốn chạy. Kết quả sẽ như sau:

khóa học lập trình web



CÔNG TY CỔ PHẦN AN TÂM ĐỨC
Địa chỉ: Ki ốt 10, Tòa Nhà CT2B, Đô thị Xa La, Hà Đông, Hà Nội
VPGD: Số 31, xóm 3, thôn Phú Đô, xã Mễ Trì, huyện Từ Liêm, Hà Nội.
Điện thoại: 04 62 966 151 Hotline: 097 5252 437 - Fax: 0942 459 521 Email: daotaolaptrinh.edu@gmail.com

website: antamduc.com | daotaolaptrinh.edu.vn | atdtravel.net | dulichantamduc.com.vn