P H P . V N

Thiết kế website Chuẩn SEO - Giá rẻ
Thuê Website MIỄN PHÍ Domain
+84 81845 6969
blog image

Hướng dẫn thiết kế Web HTML đầy đủ A-Z mới nhất

Bạn là lập trình viên và muốn tự học thiết kế web bằng HTML? Hãy tham khảo ngay phương pháp của chúng tôi dưới đây nhé

HTML là gì?

HTML là viết tắt của Hypertext Markup Language, là ngôn ngữ lập trình dùng để xây dựng và cấu trúc lại các thành phần của trang web.

HTML không phải là ngôn ngữ lập trình, nó không thể thực hiện các chức năng “động”. HTML chỉ có tác dụng bố cục và định dạng trang web.

HTML khi được kết hợp với CSS và JavaScript sẽ trở thành một nền tảng vững chắc cho thế giới mạng.

code thiết kế web bằng html

Phần mềm thiết kế web HTML đơn giản phổ biến hiện nay

Hiện nay có nhiều công cụ hỗ trợ cho việc làm web bằng HTML như:

1. Phần mềm Notepad

Notepad hỗ trợ người dùng học làm web với HTML miễn phí, nó bao gồm các tính năng như số dòng, mã màu, gợi ý, công cụ hữu ích khác. Notepad là phần mềm phổ biến cho các nhà phát triển front end

Phần mềm Notepad

2. Phầm mềm làm Web HTML Komodo Edit

Komodo Edit là mã nguồn mở, miễn phí để tải xuống. Nó có nhiều tính năng tuyệt vời để phát triển HTML, CSS

Phầm mềm làm Web HTML Komodo Edit

3. Ứng dụng làm web với HTML Eclipse

Eclipse hỗ trợ cho việc phát triển web ở nhiều ngôn ngữ khác nhau, nó có cấu trúc Plug in

4. Phần mềm xây dựng website HTML CoffeeCup Free HTML Editor

CoffeeCup Free HTML Editor có hai phiên bản miễn phí và nâng cao Responsive Site Design hỗ trợ Responsive Web Design, phiên bản này được thêm nhiều tính năng chỉnh sửa và tính năng nâng cao khác

Phần mềm xây dựng website HTML CoffeeCup Free HTML Editor

5. Ứng dụng tạo web HTML Aptana Studio

Aptana Studio không chỉ tập trung vào HTML mà còn vào các ngôn ngữ khác cho phép bạn thêm nhiều ứng dụng mạng hữu ích khác.

Ứng dụng tạo web HTML Aptana Studio

Hướng dẫn làm 1 trang web bằng HTML

1. Cấu trúc của một HTML đơn giản:

webhtml

webhtml

Ví dụ về thẻ trang web HTML đơn giản về công ty:

web html

2. Định dạng trang HTML đơn giản

2.1 Định dạng danh sách thực đơn với thể OL, ta có cấu trúc như sau:

web html1

2.2. Thẻ định dạng kí tự

Strong = b : In đậm

EM = I : In nghiêng

S = STRIKE: Chữ bị gạch ngang

BIG: Chữ lớn hơn bình thường

Small: chữ nhỏ hơn bình thường

SUP: Đinh nghĩa chỉ số trên

SUB: Chỉ số dưới

BASEFONT: Định nghĩa kích thước font chữ.

FONT: Kiểu chữ hiển thị.

web html

2.3 Xác định màu sắc thiết kế website

màu sắc web html

Thẻ màu trong HTML có dạng sau: #RRGGBB, ta có các bảng màu cơ bản sau:

– Đỏ/RED: #FF0000

– Đỏ sẫm/DARKRED: #8B0000

– Xanh lá cây/GREEN: #00FF00

– Xanh nhạt/LIGHTGREEN: #90EE90

– Xanh nước biển/BLUE: #0000FF

– Vàng/YELLOW: #FFFF00

– Vàng nhạt/LIGHTYELLOW: #FFFFE0

– Trắng/WHITE: #FFFFFF

– Đen/BLACK: #000000

– Xám/GRAY: #808080

– Nâu/BROWN: #A52A2A

– Tím/MAGENTA: #FF00FF

– Tím nhạt/VIOLET: #EE82EE

– Hồng/PINK: #FFC0CB

– Da cam/ORANGE: #FFA500

– Màu hải quân/NAVY: #000080

Sau đây PHP sẽ áp dụng vào trang web cụ thể nhé

web html

web html

3. Tạo liên kết trong web HTML

liên kết cho web html

3.1.Thẻ Body

web html

Lưu ý:

LINK: Chỉ định màu của liên kết

ALINK: Chỉ định màu của liên kết đăng được chọn

VLINK: Chỉ định màu của liên kết đã từng mở

BACKGROUND: Hình ảnh nền của trang web

BGCOLOR: màu nền của trang web

TEXT: màu của chữ trong trang web

SCROLL(yes/no): xác định có hay không có thanh cuôn

TOPMARGIN: Lề bên trên của trang web

RIGHTMARGIN: Lề phải của trang web

LEFTMARGIN: Lề trái của trang web

BOTTOMMARGIN: Lề dưới của trang web

3.2. Kiểu chữ cho văn bản

font chữ web html

web html

3.3. Liên kết đến trang web khác

web html

Ví dụ với trang web đơn giản của công ty

web html

web html

web html

4. Chèn âm thanh, hình ảnh vào website

hình ảnh cho web html

4.1 Chèn âm thanh

web html

4.2.Chèn hình ảnh

web html

web html

5. Tạo bảng biểu cho trang web

bảng biểu cho trang web html

web html

Định dạng:

ALIGN = LEFT / CENTER / RIGHT:

BORDER = n

BORDERCOLOR = color

BORDERCOLORDARK = color

BORDERCOLORLIGHT = color

BACKGROUND = url

BGCOLOR = color

CELLSPACING = spacing

CELLPADDING = pading

>

 

ALIGN = LEFT / CENTER / RIGHT

VALIGN = TOP / MIDDLE / BOTTOM

BORDERCOLOR = color

BORDERCOLORDARK = color

BORDERCOLORLIGHT = color

BACKBROUND = url

BGCOLOR = color

COLSPAN = n

ROWSPAN = n

>

ALIGN / VALIGN: Canh lề cho bảng và nội dung trong ô.

BORDER: Kích thước đường kẻ chia ô trong bảng.

BORDERCOLOR: Màu đường kẻ

BORDERCOLORDARK/BORDERCOLORLIGHT: Màu tối và sáng của đường kẻ

BACKGROUND: Ảnh nền cho cho bảng.

BGCOLOR: Màu nền cho bảng.

CELLSPACING: Khoảng cách giữa các ô trong bảng

CELLPADDING: Khoảng cách giữa nội dung và đường kẻ.

COLSPAN: Trộn cột

ROWSPAN: Trộn dòng.

Trên đây PHP cung cấp cách làm 1 trang web bằng HTML cơ bản hi vọng bạn có thể có thêm những kiến thức bổ ích cho mình.

Hotline: 03.58.68.58.40

Fanpage: Thiết kế Website chuẩn SEO theo yêu cầu.

Có thể bạn quan tâm: