Nội dung bài viết
Giới thiệu nội dung bài viết
Nằm trong chuỗi các bài viết chia sẻ về lập trình web HTML từ cơ bản tới nâng cao, hôm nay anh sẽ tiếp theo giới thiệu đến các bạn về các định dạng text [formatting] trong HTML. Bên cạnh giới thiệu các kiểu định dạng [formatting] có trong HTML, anh cũng sẽ hướng dẫn các bạn – những người học lập trình web
HTML cách thao tác như thể nào với các định dạng bao gồm: Hiển thị chữ đậm, nghiêng, gạch chân, gạch ngang đoạn text, monospace chữ, superscript chữ, chèn thêm chữ, sử dụng chữ to, chữ nhỏ hơn, và cách để nhóm các thẻ lại với nhau trong lập trình web HTML.
Để biết cụ thể như thế nào thì chúng ta hãy tiếp tục đọc những chia sẻ bên dưới ngay nhé!
1. Hiển thị chữ đậm
Để hiển thị chữ đậm trong HTML ta dùng thẻ b như sau
1
2
3
4
5
6
7
8
9
10
11
12
Bold Text Example
The following word uses a bold typeface.
2. Hiển thị nghiêng
Để hiển thị chữ nghiêng ta dùng thẻ i như sau
1
2
3
4
5
6
7
8
9
10
11
12
Italic Text Example
The following word uses an italicized typeface.
3. Gạch chân đoạn text
Để gạch chân đoạn text ta sử dụng thẻ u như sau
1
2
3
4
5
6
7
8
9
10
11
12
Underlined Text Example
The following word uses an underlined typeface.
4. Gạch ngang đoạn text
Để gạch ngang đoạn text ta sử dụng thẻ strike như sau
1
2
3
4
5
6
7
8
9
10
11
12
Strike Text Example
The following word uses a strikethrough typeface.
5. Monospace chữ
Chúng ta có thể làm một số chữ nhỏ hơn trong cùng một câu bằng cách dùng thẻ tt như sau
1
2
3
4
5
6
7
8
9
10
11
12
Monospaced Font Example
The following word uses a monospaced typeface.
6. Superscript chữ
Ví dụ như ta muốn làm đơn vị đo là m2. Số 2 được đưa lên phía trên thì ta dùng thẻ sup như sau
1
2
3
4
5
6
7
8
9
10
11
12
Superscript Text Example
The following word uses a superscript typeface.
7. Chèn thêm chữ
Chúng ta có thể chèn thêm chữ vào đoạn văn bằng thẻ ins và delete chữ bằng thẻ del như sau
1
2
3
4
5
6
7
8
9
10
11
12
Inserted Text Example
I want to drink cola wine
8. Sử dụng chữ to hơn
Chúng ta dùng thẻ big để làm chữ to hơn trong một câu
1
2
3
4
5
6
7
8
9
10
11
12
Larger Text Example
The following word uses a big typeface.
9. Sử dụng nhỏ hơn
Chúng ta có thể sử dụng thẻ small để làm chữ nhỏ hơn như sau
1
2
3
4
5
6
7
8
9
10
11
12
Smaller Text Example
The following word uses a small typeface.
9. Nhóm các thẻ lại với nhau
Chúng ta sử dụng thẻ div hoặc span để nhóm các thẻ lại với nhau.
- Ví dụ chúng ta sử dụng div để nhóm các thành phần của HTML vào một chỗ. Thẻ div là một thẻ quan trọng. Khi ta set giá trị cho thẻ div, các phần tử bên trong thẻ div sẽ được áp dụng chung thuộc tính mà ta set cho div.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
HTML div Tag
This is first group
Following is a list of vegetables
Beetroot
Ginger
Potato
Radish
This is second group
Following is a list of fruits
Apple
Banana
Mango
Strawberry
- Ví dụ thẻ span được sử dụng nhóm các thuộc tính trên cùng một dòng. Sự khác nhau giữa span và div là . Span chỉ áp dụng trên một dòng [inline] ở các phần tử còn div sẽ áp dụng cho một nhóm [blocked] nhiều thành phần.
1
2
3
4
5
6
7
8
9
10
11
12
13
Span Tag Example
This is the example of span tag
and the div tag alongwith CSS
10. Video Demo
11. Thực hành online và source code