Tạo HTML
|
Cùng gitiho contest chinh phục kiến thức, khẳng định bản thân với hệ thống bài test phong phú, đầy đủ các chủ đề để bạn khám phá. Show
Khám phá ngay Chương trình hội viên Gitiho Tiết kiệm tối đa với gói Hội viên Gitiho. Thỏa mãn việc nâng cao kiến thức của bạn với gói Hội viên Gitiho bạn sẽ không còn bị giới hạnbởi số lượng khóa học đã mua. Gói hội viên Gitiho mang đến trải nghiệm học tập hoàn toàn mới, phù hợp với những học viên cần học nhiều nội dung trong trong một khoản thời gian sẽ giúp học viên tiết kiệm hơn rất nhiều so với mua lẻ hoặc combo. Hơn 20.000 người đã đăng ký Khám phá chương trìnhGitiho for leading business Tối ưu và đơn giản hóa hoạt động đào tạo tại doanh nghiệp. Sẵn sàng nền tảng, nội dung đào tạo cho tất cả các vị trí, bộ phận. Ứng dụng MIỄN PHÍ ngay vào doanh nghiệp chỉ với MỘT click. Đã được tin tưởng sử dụng bởi các doanh nghiệp Đăng ký miễn phí
Hà Vân XEM NHANH BÀI VIẾT HTML là gì? Lập trình HTML là gì? Hãy cùng chúng mình tìm hiểu ngay về HTML và cách chạy file HTML trong Visual Studio Code hiệu quả trong bài viết ngay dưới đây các bạn nhé. HTML là gì?HTML (Hypertext Markup Language) là một loại ngôn ngữ đánh dấu siêu văn bản. HTML được tạo ra để xây dựng hoặc cấu trúc lại một website. HTML giúp chúng ta chuyển đổi từ một văn bản bình thường hoặc một file thiết kế thành một trong giao diện website. HTML sẽ quản lý những nội dung này dưới dạng có thẻ với 3 loại cơ bản là:
Hầu hết các trang Web mà bạn đang lướt hàng ngày được bố cục và định dạng bởi HTML. Để học được cách dùng HTML thì các bạn phải sử dụng một trình soạn thảo có tên là Visual Studio Code (sau đây sẽ gọi tắt VSCode). Giao diện của trình soạn thảo nào có dạng như sau: Bây giờ chúng ta sẽ tạo ra một thư mục trống rồi mở nó lên trong VSCode. Cách tạo rất đơn giản mà bạn nào cũng biết là bấm chuột phải => chọn New Folder => đặt tên cho thư mục rồi bấm Enter. Sau đó các bạn chỉ cần kéo thư mục đã tạo vào VSCode, phần mềm sẽ tự động mở nó lên cho bạn:
Trên đây là những kiến thức cơ bản về HTML và VSCode. Chúng ta sẽ cùng tìm hiểu chi tiết hơn trong phần sau của nội dung bài viết này các bạn nhé. Xem thêm: Hướng dẫn cách chuyển đổi bảng Excel sang HTML Hướng dẫn cách sử dụng VSCodeCách tạo một file trong VSCodeCác bạn nhấp chuột phải vào vùng trống ở trong thư mục mà chúng ta đã đưa vào VSCode. Sau đó các bạn chọn New File: Tiếp theo chúng ta sẽ đặt tên cho file mới này. Có một số lưu ý về đặt tên các bạn cần nhớ như sau:
Ở đây chúng mình sẽ đặt tên file là "index" với phần đuôi mở rộng là ".html" để máy tính nhận diện được đây là file HTML. Cách comment trong file HTMLComment trong file HTML trên VSCode có tác dụng giúp chúng ta ghi chú lại tác dụng của một đoạn code. Để comment được trong file HTML thì các bạn sẽ bôi đen đoạn code, sau đó bấm giữ tổ hợp phím tắt Ctrl + ? nhé. Sau đó các bạn chỉ cần nhập comment vào để phân biệt tác dụng của các đoạn code. Cách tạo File HTML trong Visual Studio CodeĐể tạo cấu trúc một file HTML trong VSCODE, các bạn nhập vào VSCode là "html:5" sau đó bấm phím Tab thì sẽ thấy file hiển thị như sau: Trong cấu trúc trên các bạn có thể nhìn thấy được cả 3 loại thẻ của HTML là thẻ đi theo cặp đóng - mở, thẻ chỉ mở và thẻ chỉ đóng. Chức năng của các thẻ trong cấu trúc HTML trên cụ thể như sau:
Xem thêm: Hướng dẫn cách chuyển file Word sang HTML đơn giản nhất Cách chạy file HTML trên trình duyệtTrước khi chạy file thì các bạn phải bấm tổ hợp phím tắt Ctrl + S trong VSCode để lưu lại những đoạn code mới. Cách 1: Chạy HTML trực tiếp trên trình duyệtĐể mở một file HTML trên trình duyệt thì các bạn đi đến thư mục chứa file đó mà chúng ta đã tạo ban đầu => nhấp chuột phải vào tên file => chọn Open With => chọn Choose another app. Sau đó các bạn chọn trình duyệt mà mình muốn sử dụng => tích vào ô "Always use this app to open .html files". Thao tác này có nghĩa là sau này tất cả file có đuôi dạng .html sẽ được mở trên trình duyệt bạn đã chọn. Cách 2: Chạy file HTML trực tiếp trong VSCodeCó một cách chạy file khác là chúng ta sẽ chạy luôn trên VSCode. Tuy nhiên, chúng ta sẽ cần cài đặt một tiện ích mở rộng hay còn gọi Extension. Đây là những tiện ích có sẵn trong VSCode, các bạn chỉ cần cài đặt thôi nhé. Trên giao diện làm việc của VSCode, các bạn bấm vào biểu tượng của Extension như trong hình ảnh dưới đây hoặc bấm tổ hợp phím tắt Ctrl + Shift + X. Sau đó các bạn nhập vào thanh tìm kiếm một tiện ích tên là "View in browser". Các bạn chỉ cần kích chuột vào tiện ích đó là nó sẽ được cài đặt tự động. Để chạy thử file HTML trên trình duyệt ngay trong VSCode thì các bạn đến phần lưu file => bấm chuột phải vào file => chọn View in Browser hoặc bấm tổ hợp phím tắt Ctrl + F1 là file sẽ được tự động mở lên trong trình duyệt. Các bạn làm theo cách tương tự để cài một tiện ích khác là tên là: Auto Rename Tag. Tiện ích này có tác dụng giúp bạn sửa thẻ đóng tự động khi bạn đã sửa thẻ mở trong một cặp thẻ đóng - mở. Khi đã cài đặt xong thì các bạn có thẻ tắt thẻ Extension đi để chúng chạy thử. Xem thêm: Cách sử dụng hàm importHTML để chuyển một bảng từ trang web HTML sang Google Sheets Kết luậnNhư vậy, chúng mình đã giới thiệu HTML là gì? đồng thời hướng dẫn các bạn về cấu trúc của một file HTML, cách tạo file HTML trong Visual Studio Code và chạy HTML trên VSCode. Hy vọng bài viết này sẽ hữu ích với bạn trong quá trình làm quen với HTML. Để được học về HTML một cách đầy đủ và chuyên sâu hơn thì các bạn hãy tham gia khóa học:
Khóa học phù hợp với các bạn đang tìm hiểu về lập trình web với ngôn ngữ HTML và CSS. Sau khi hoàn thành tất cả bài học, các bạn sẽ nắm chắc được bản chất và cách thực hoạt động của HTML. Đồng thời, các bạn có thể ứng dụng kiến thức được học về các thẻ tag cơ bản trong HTML để xây dựng bộ khung cho website. Trong quá trình học, các bạn có thể trao đổi về vấn đề chưa hiểu với chuyên gia ngay trong phần Hỏi - Đáp dưới video bài giảng. Mọi thắc mắc sẽ được phản hồi trong vòng 24h các bạn nhé. Chúc các bạn học tập hiệu quả. Thích 0 Chia sẻ 5/5 - (2 bình chọn) 5/5 - (2 bình chọn) Bài viết liên quan Hướng dẫn về hàm ACOS của OracleHướng dẫn về hàm ATAN của OracleHướng dẫn về hàm COS của OracleHướng dẫn về hàm AVG của OracleTìm hiểu chi tiết về các thẻ định dạng chữ (Text) trong HTMLBài tập thực hành với các thẻ định dạng chữ trong HTML× Chúc mừng bạn đã nhận được quà tặng "" HÃY ĐĂNG NHẬP ĐỂ NHẬN QUÀ NGAY Đăng nhập bằng Google Đăng nhập bằng Apple Hoặc đăng nhập Đăng nhậpĐăng ký tài khoản Đăng nhập bằng Google Đăng nhập bằng Apple Hoặc đăng ký Đăng kýĐăng nhập Khóa học của tôi Bạn vui lòng đăng nhập để gửi tương tác Đăng nhập Đăng nhập bằng Google Đăng nhập bằng Apple Hoặc đăng nhập Đăng nhậpĐăng ký tài khoản Đăng ký Đăng nhập bằng Google Đăng nhập bằng Apple Hoặc đăng ký Đăng kýĐăng nhập  Top Thông báo: Lịch nghỉ tết nguyên đán Quý Mão 2023 của Gitiho bắt đầu từ ngày 20/01/2023 đến hết ngày 26/01/2023 Kính chúc quý khách hàng và đối tác một năm mới An khang - Thịnh vượng Hỗ trợ khách hàng Email: [email protected] Hotline: 0774 116 285 (Giờ làm việc: 8h30 - 18h, nghỉ chiều thứ 7 và CN) Những câu hỏi thường gặp Hướng dẫn đăng ký khoá học Hướng dẫn đăng nhập Hướng dẫn lấy lại mật khẩu Hướng dẫn thanh toán khóa học sau khi đăng ký thành công VỀ GITIHO Giới thiệu về Gitiho Blog Hỏi đáp Đào tạo cho doanh nghiệp Chính sách bảo mật thông tin Chính sách và quy định chung Quy định mua, hủy, sử dụng khóa học Bộ quy tắc hành xử của giảng viên và học viên trên Gitiho Quy trình xác nhận – hoàn, hủy đơn hàng tại hệ thống Gitiho Cách lấy chứng nhận Gitiho hợp tác và liên kết Dạy học trên Gitiho Dịch vụ Doanh nghiệp Đăng ký Gitiho Affiliate Tuyển dụng giảng viên Tuyển dụng nhân sự Tải App Gitiho Kết nối với chúng tôi Địa chỉ văn phòng: Phòng 302, tầng 3, Tòa nhà Tây Hà, KĐT mới Phùng Khoang, Phường Trung Văn, Quận Nam Từ Liêm, Thành phố Hà Nội, Việt Nam |
