Các thẻ đinh dạng văn bản trong html, các thẻ cơ bản trong html

Thảo luận trong 'Ngôn ngữ lập trình CSS, HTML, HTML5' bắt đầu bởi admin, 17/2/14.

  1. admin
    Tham gia ngày:
    22/5/13
    Bài viết:
    4,884
    Đã được thích:
    1,194
    Điểm thành tích:
    113
    Giới tính:
    Nam
    Nội dung của trang web cũng có thể được trình bày giống các tài liệu văn bản khác như Font chữ lớn nhỏ, đậm nhạt, nghiêng, gạch chân, màu sắc,... Việc định dạng này được thực hiện thông qua các thẻ định dạng văn bản trong HTML, chúng giúp các trình duyệt Web hiểu được cách trình bày và hiển thị văn bản trên trang Web.

    the-dinh-dang-van-ban-trong-html.jpg

    Sau đây là các thẻ định dạng cơ bản trong tập tin HTML

    Thẻ tiêu đề (Heading)

    Thẻ Heading thường được dùng để đánh dấu phần tiêu đề của văn bản, bao gồm thẻ bắt đầu <hx> và thẻ kết thúc </hx>, trong đó x là từ 1 đến 6 mức kích thước lớn nhỏ của Font chữ thể hiện trên trang Web. Thông thường h1 là lớn nhất và h6 là nhỏ nhất, tuy nhiên các thẻ Heading này có thể được định dạng lại tùy ý. HTML sẽ tự động thêm dòng trống trước và sau tiêu đề này.

    Thí dụ:
    Mã:
    <h1>Dòng này được đặt trong thẻ h1</h1>
    <h2>Dòng này được đặt trong thẻ h2</h2>
    <h3>Dòng này được đặt trong thẻ h3</h3>
    <h4>Dòng này được đặt trong thẻ h4</h4>
    <h5>Dòng này được đặt trong thẻ h5</h5>
    <h6>Dòng này được đặt trong thẻ h6</h6>
    
    Kết quả hiển thị:
    • Dòng này được đặt trong thẻ h1
    • Dòng này được đặt trong thẻ h2
    • Dòng này được đặt trong thẻ h3
    • Dòng này được đặt trong thẻ h4
    • Dòng này được đặt trong thẻ h5
    • Dòng này được đặt trong thẻ h6
    Thẻ đoạn văn bản (Paragraph)

    Văn bản nằm trong thẻ này sẽ được đánh dấu là một đoạn, thẻ này bao gồm thẻ bắt đầu <p> và thẻ kết thúc </p>. HTML sẽ tự động thêm dòng trống trước và sau đoạn văn bản này để tạo khoảng cách giữa các đoạn văn bản với nhau.

    Thí dụ:
    Mã:
    <p>Đây là đoạn văn bản thứ 1</p>
    <p>Đây là đoạn văn bản thứ 2</p>
    
    Kết quả hiển thị:
    • Đây là đoạn văn bản thứ 1
    • Đây là đoạn văn bản thứ 2
    Thẻ ngắt dòng (Line Breaks)

    Thẻ này đánh dấu việc kết thúc một dòng nhưng không bắt đầu một đoạn mới. Thẻ này chỉ có thẻ bắt đầu <br> và không cần thẻ kết thúc, văn bản nằm sau thẻ này sẽ được chuyển xuống dòng dưới, có thể dùng nhiều thẻ này liên tiếp nhau để tạo nhiều dòng trống.

    Thí dụ:
    Mã:
    <p>Đây là đoạn văn bản thứ 1</p>
    <p>Đây là dòng thứ 1 của đoạn văn bản thứ 2<br>Đây là dòng thứ 2 của đoạn văn bản thứ 2</p>
    
    Kết quả hiển thị:
    • Đây là đoạn văn bản thứ 1
    • Đây là hàng thứ 1 của đoạn văn bản thứ 2
    • Đây là hàng thứ 2 của đoạn văn bản thứ 2
    Thẻ định dạng đậm cho văn bản
    • Các văn bản đặt trong thẻ này sẽ được hiển thị đậm, thẻ này bao gồm thẻ bắt đầu <b> hoặc <strong> và thẻ kết thúc </b> hoặc </strong>
    Thí dụ:
    Mã:
    <b>Dòng này được in đâm</b>
    <strong>Dòng này được in đâm</strong>
    
    Kết quả hiển thị:
    • Dòng này được in đâm
    • Dòng này được in đâm
    Thẻ định dạng nghiêng cho văn bản

    Các văn bản đặt trong thẻ này sẽ được hiển thị nghiêng, thẻ này bao gồm thẻ bắt đầu <em> hoặc <i> và thẻ kết thúc </em>hoặc </i>

    Thí dụ
    :

    Mã:
    <em>Dòng này được in nghiêng</em>
    <i>Dòng này được in nghiêng</i>
    Các chữ này bình thường. <i>Các chữ này được in nghiêng.</i> Các chữ này bình thường.
    
    Kết quả hiển thị:
    • Dòng này được in nghiêng
    • Dòng này được in nghiêng
    • Các chữ này bình thường. Các chữ này được in nghiêng. Các chữ này bình thường.
    Thẻ định dạng gạch dưới cho văn bản

    Các văn bản trong thẻ này sẽ được hiển thị gạch dưới,
    thẻ này bao gồm thẻ bắt đầu <u> và thẻ kết thúc </u>

    Thí dụ:
    Mã:
    <u>Dòng này được gạch dưới</u>
    Các chữ này bình thường. <u>Các chữ này được gạch dưới.</u> Các chữ này bình thường.
    
    Kết quả hiển thị:
    • Dòng này được gạch dưới
    • Các chữ này bình thường. Các chữ này được gạch dưới. Các chữ này bình thường.
    Kết hợp các thẻ định dạng cho văn bản bằng cách lồng chúng vào nhau

    Thí dụ
    :

    Mã:
    <b><i><u>Dòng này được in đậm, nghiêng và gạch dưới</u></i></b>
    
    Kết quả hiển thị:
    • Dòng này được in đậm, nghiêng và gạch dưới
    Thẻ tạo danh sách không đánh số thứ tự

    Các văn bản trong thẻ này sẽ được hiển thị dưới dạng đánh dấu đầu dòng, thẻ này bao gồm thẻ bắt đầu <ul> và thẻ kết thúc </u> Danh sách nằm bên trong thẻ này được đặt trong các thẻ <li>Dòng thứ 1</li><li>Dòng thứ 2</li>

    Thí dụ:
    Mã:
    <ul>
        <li>Dòng thứ 1</li>
        <li>Dòng thứ 2</li>
    </ul>
    
    Kết quả hiển thị:
    • Dòng thứ 1
    • Dòng thứ 2
    Thẻ tạo danh sách có đánh số thứ tự

    Các văn bản trong thẻ này sẽ được hiển thị dưới dạng đánh dấu đầu dòng, thẻ này bao gồm thẻ bắt đầu <ol> và thẻ kết thúc </o> Danh sách nằm bên trong thẻ này được đặt trong các thẻ <li>Dòng số 1</li><li>Dòng số 2</li>

    Thí dụ
    :

    Mã:
    <ol>
         <li>Dòng số 1</li>
         <li>Dòng số 2</li>
    </ol>
    
    Kết quả hiển thị:
    1. Dòng số
    2. Dòng số 2
     
    Cảm ơn đã xem bài:

    Các thẻ đinh dạng văn bản trong html, các thẻ cơ bản trong html

    Chỉnh sửa cuối: 7/6/16
  2. huyenholo
    Tham gia ngày:
    23/5/16
    Bài viết:
    5
    Đã được thích:
    0
    Điểm thành tích:
    6
    Giới tính:
    Nữ
    bài đăng rất bỏ ích, rất hay
     


Chủ để tương tự : Các thẻ
Diễn đàn Tiêu đề Date
Ngôn ngữ lập trình CSS, HTML, HTML5 Thẻ <METER> Element Tag trong HTML5 cách sử dụng 25/2/18
Ngôn ngữ lập trình CSS, HTML, HTML5 Thẻ <PROGRESS> Element Tag trong HTML5 cách sử dụng 25/2/18
Ngôn ngữ lập trình CSS, HTML, HTML5 B6: Hoc CSS nâng cao các thẻ Div trong HTML5 7/1/16
Ngôn ngữ lập trình CSS, HTML, HTML5 B5: Các loại khai báo CSS, CSS là gì? các thẻ CSS căn bản trong html5(p2) 10/12/15
Ngôn ngữ lập trình CSS, HTML, HTML5 Thuộc tính đường viền bóng mờ trong css html đẹp mặt cho các thẻ <div> <h> 1/10/14