Thiết kế bối cảnh web bởi HTML là trong những chủ đề có tính chuyên môn. Nó yên cầu người học đề xuất có kỹ năng cơ bạn dạng về lập trình. Tuy nhiên, ko phải ai ai cũng có thời cơ được học và gồm sự nối tiếp về công nghệ.

Bạn đang xem: Thiết kế giao diện web bằng css

Vậy nên, bài viết này sẽ khái quát cho chính mình đọc, tốt nhất là những người dân ngoài ngành đọc hơn về HTML. Cùng làm núm nào để kiến thiết giao diện web bởi HTML một cách đơn giản và dễ dàng và thuận tiện nhất.

*

HTML là gì?

HTML là thuật ngữ siêng ngành, được viết tắt tự chữ “Hypertext Markup Language”. HTML không được xem như như là ngữ điệu lập trình. Bởi nó không tạo nên những công dụng có tính thao tác. Nó chỉ cung cấp người dùng phân bổ bố cục, định dạng kết cấu trang web theo từng phần.

Có thể gọi một cách 1-1 giản, HTML có tác dụng như một Microsoft Word. Góp định dạng, phân loại văn bản, các khối, những phần.

Làm vắt nào để sản xuất 1 tệp tin HTML?

Ngày nay, có khá nhiều chương trình cung cấp tạo tệp tin HTML. Thậm chí, người tinh thông lập trình có thể tự sản xuất file HTML bởi notepad++. Tuy nhiên, đối với những fan không am hiểu, thì đấy là việc không hề dễ dàng.

1. Một số phần mềm hỗ trợ tạo file HTML miễn phí

Sau đây, là một trong những phần mềm có cung cấp tạo tệp tin HTML miễn phí. Bạn dùng rất có thể dễ dàng tra cứu thấy liên kết để mua các phần mềm này trường đoản cú Google.

*

✧ ứng dụng NotePad ++

✧ phần mềm Visual Studio Code

✧ ứng dụng Sublime Text

✧ phần mềm Komodo Edit

✧ ứng dụng Eclipse

✧ ứng dụng NetBeans

✧ phần mềm BlueGriffon

✧ phần mềm Bluefish

✧ phần mềm Emacs Profile

✧ phần mềm Aptana Studio

✧ ứng dụng CoffeeCup không lấy phí HTML Editor

✧ ứng dụng Microsoft Visual Studio Community

Trong những phần mềm kể trên, chúng tôi khuyến khích bạn dùng, sử dụng Visual Studio Code. Bởi đây là chương trình của Microsoft. Thừa trình thiết đặt đơn giản, cấp tốc chóng. Giao diện dễ nhìn, dễ thao tác. Với là lý lẽ được các lập trình viên dùng các nhất bên trên TG hiện nay.

2. Thiết đặt Visual Studio Code

Truy cập vào trang hỗ trợ phần mềm gốc: https://code.visualstudio.com/ 

*

Chọn nút Download → lúc này sẽ có các phiên bản cho người tiêu dùng lựa chọn. Tùy theo thông số kỹ thuật máy, mà chọn file tương thích.

*

Sau khi download xong, hãy chạy tệp cài đặt đặt. Cụ thể như sau:

➢ Nhấp lưu ban vào tệp để bước đầu cài đặt Visual Studio Code.

➢ chứng thực các điều khoản của thỏa thuận.

➢ Nhấp vào nút “Next”.

➢ thực hiện vị trí thiết lập mặc định, kế tiếp nhấp vào nút “Next“.

➢ Sử dụng setup mặc định của menu Start, tiếp nối nhấp vào nút “Next“.

➢ trên mục “Other”, tích lựa chọn mục:

✧ địa chỉ cửa hàng “Open with code” kích hoạt to Windows Explorer file context menu.

✧ địa chỉ cửa hàng “Open with code” action to Windows Explorer directory context menu.

Xem thêm: Eevee Hệ Tiên - Cách Tiến Hóa Eevee Trong Pokémon Go

✧ Register Code as an editor for supported file types.

✧ địa chỉ to PATH.

➢ Nhấp vào nút “Install”.

➢ Nhấp vào nút “Finish”.

Như vậy, các bạn đã cài đặt xong phiên bản Visual Studio Code rồi đó. Sau này, nếu như bạn cần thêm những tiện ích hỗ trợ cho câu hỏi lập trình hoặc thiết kế giao diện web bằng HTML và CSS của mình thì chúng ta có thể mở phần mềm lên, tìm về mục Extension để sở hữu đặt.

Vì đây không phải là nội dung bao gồm của bài xích viết, buộc phải mình sẽ không làm hướng dẫn đưa ra tiết, kị lang mang, mất thời gian.

3. Tạo ra file HTML đầu tiên

Để cho đối kháng giản, bạn tạo sẵn một thư mục có tên là “HTML” sinh hoạt trên ổ đĩa, tại địa chỉ mà bạn muốn lưu trữ dữ liệu.

*

Sau đó, mở công tác Visual Studio Code lên.

Chọn File → chọn Open Folder… → tìm về thư mục “HTML” vừa chế tác → click chuột trái lên thư mục “HTML” để xác định file vừa lựa chọn → nhấn nút Select Folder.

*

Sau khi mở file thành công, bạn sẽ có bối cảnh như hình.

Click vào biểu tượng (New file) → tạo 1 file mang tên là “index.html”.

*

Lưu ý: tất cả hầu hết file thiết kế giao diện web bằng HTML đều phải sở hữu đuôi chấm html (.html).

Sau bước này, các bạn sẽ có giao diện như những hình ở mục mặt dưới.

Khởi tạo thành một trang web bằng HTML

1. Tạo cấu trúc HTML cơ bản

Gõ lốt “!” trên tệp tin index.html (hình), rồi nhận Enter. Ta được một kết cấu tổng quát cho một trang HTML (xem hình).