Tải về bản PDF Tải về bản PDF

Đây là bài viết hướng dẫn cách tạo trang web bằng HTML. Một vài yếu tố tạo nên trang web là chữ, đường dẫn và hình ảnh.

Phương pháp 1 của 7:
Chuẩn bị trước khi viết

  1. 1
    Mở chương trình chỉnh sửa văn bản cơ bản. Trên máy tính Windows, chương trình chỉnh sửa văn bản cơ bản mặc định là Notepad; còn người dùng Mac có thể sử dụng chương trình TextEdit:
  2. 2
    Tìm hiểu thẻ HTML. Khi viết trong HTML, các yếu tố khác của trang được xác định bằng thẻ mở (<>) và thẻ đóng (</>), với phần nội dung của yếu tố được đặt trong các thẻ.
    • Ví dụ, một đoạn văn bản được tạo bằng cách nhập thẻ mở đoạn (<p>), nhập nội dung mà bạn muốn dùng, rồi nhập thẻ đóng đoạn </p>.
    • Mỗi dòng mã phải được nhập trên dòng riêng, nên bạn sẽ ấn Enter sau khi nhập mỗi dòng mã.
  3. 3
    Xem lại định dạng HTML cơ bản. Để tạo văn bản HTML bất kỳ, bạn sẽ mở đầu văn bản với thẻ "document type" (loại văn bản) (<!DOCTYPE html>), thẻ HTML (<html>), và thẻ BODY (thân) (<body>). Bạn cũng sẽ kết thúc văn bản bằng thẻ đóng BODY và thẻ đóng HTML. Ví dụ:
    • <!DOCTYPE html>
    • <html>
    • <body>
    • </body>
    • </html>
  4. 4
    Cân nhắc học CSS. Đây là loại ngôn ngữ bổ trợ cho HTML; chuyên về định dạng trang (chẳng hạn như màu sắc, căn giữa cho chữ, v.v.) và các yếu tố hình ảnh khác của trang web.
    Quảng cáo

Phương pháp 2 của 7:
Tạo trang văn bản

  1. 1
    Thiết lập văn bản. Thêm mã HTML mở đầu của văn bản:
    • <!DOCTYPE html>
    • <html>
    • <body>
  2. 2
    Tạo tiêu đề của trang web. Phần này còn được gọi là "head" (phần mở đầu) và nội dung tại đây sẽ hiển thị trên thẻ của trình duyệt. Hãy thêm đoạn mã sau vào văn bản để tạo tiêu đề, và nhớ thay "Tiêu đề của bạn" bằng nội dung mà bạn thích:
    • <head>
    • <title>Tiêu đề của bạn</title>
    • </head>
  3. 3
    Thêm đề mục. Nhập <h1>Nội dung</h1> và ấn Enter. Bạn có thể thêm nội dung bất kỳ vào giữa thẻ <h1></h1>.
    • Bạn có thể bố trí nhiều đề mục trên trang. Hãy tăng số thứ tự cho mỗi đề mục mà bạn sử dụng sau đề mục đầu tiên (ví dụ: đề mục thứ hai sẽ có mã <h2></h2>).
  4. 4
    Tạo đoạn văn bản. Nhập <p>Nội dung</p> và ấn Enter; đừng quên thay "Nội dung" bằng nội dung của đoạn cần tạo.
    • Bạn có thể đặt mỗi dòng văn bản trên dòng mới bằng cách nhập lại thẻ <p></p> cho mỗi dòng văn bản.
  5. 5
    Lặp lại quy trình tạo đề mục và đoạn văn bản. Bạn có thể thêm nhiều đề mục và đoạn văn bản vào trang web theo ý thích.
  6. 6
    Thêm ngắt dòng cho trang. Nhập <br>Nội dung</br> và ấn Enter. Thao tác này sẽ tạo hiệu ứng ngắt dòng giữa các đoạn văn bản nếu bạn muốn phân cách các phần nội dung.
  7. 7
    Định dạng nội dung của đoạn văn bản. Bạn có thể dùng thêm nhiều thẻ khác bên trong thẻ <p></p> (ví dụ: <p><em></em></p>) để tạo định dạng:
    • <em>nội dung</em> - Tạo chữ in nghiêng.
    • <strong>nội dung</strong> - Tạo chữ in đậm.
    • <ins>nội dung</ins> - Tạo chữ được gạch dưới.
    • <del>nội dung</del> - Tạo chữ được gạch ngang.
    • <small>nội dung</small> - Tạo chữ nhỏ.
    • <!---nội dung---> - Tạo chữ ẩn. Được dùng cho việc thêm ghi chú vào trang web.
  8. 8
    Đóng thẻ BODY và HTML của văn bản. Sau khi thêm nội dung, bạn sẽ nhập </body> và ấn Enter, rồi nhập </html> để đóng văn bản. Bây giờ phần nội dung của trang gần như đã hoàn thiện, bạn có thể thêm các yếu tố khác như đường dẫn, gạch đầu dòng và hình ảnh.
    Quảng cáo

Phương pháp 3 của 7:
Chèn đường dẫn

  1. 1
    Xác định vị trí mà bạn muốn chèn đường dẫn vào trang. Ví dụ, nếu muốn chèn đường dẫn vào giữa đoạn văn bản trên trang, bạn sẽ tìm đến đoạn văn bản đó và chọn từ hoặc câu muốn dùng để chèn đường dẫn.
  2. 2
    Sao chép đường dẫn của trang web. Truy cập trang web mà bạn muốn liên kết, rồi tô chọn địa chỉ trong thanh ở gần phía trên cửa sổ và ấn Ctrl+C (Windows) hoặc Command+C (Mac).
  3. 3
    Nhập thẻ mở đường dẫn. Nhập <a href=> vào khoảng trống ngay phía trước từ hoặc câu mà bạn muốn chèn đường dẫn.
  4. 4
    Dán đường dẫn của trang web. Nhấp vào giữa href=>, rồi ấn Ctrl+V (Windows) hoặc Command+V (Mac). Bạn sẽ thấy đường dẫn hiển thị bên phải dòng href=.
    • Ví dụ, nếu chọn liên kết với YouTube, bạn sẽ thấy <a href=https://www.youtube.com/> tại đây.
  5. 5
    Thêm thẻ đóng đường dẫn. Sau phần nội dung mà bạn muốn sử dụng làm đường dẫn, hãy nhập </a>. Ví dụ, tại dòng "Follow me on Twitter" (Hãy theo dõi tôi trên Twitter) mà bạn đã liên kết với Twitter và chọn chèn đường dẫn vào "on Twitter", mã của bạn sẽ trông giống như sau:
    • <a href=https://www.twitter.com/>on Twitter</a>
  6. 6
    Thêm thẻ ID. Thẻ ID cho phép bạn liên kết một phần của nội dung với phần khác trong đoạn văn bản khác trên cùng trang. Hãy thực hiện như sau:
    • Thay thẻ <p> bằng <p id=nội dung>
    • Chọn nội dung mà bạn muốn chèn đường dẫn.
    • Nhập <a href=#nội dung> trước nội dung. Đảm bảo nội dung sau dấu "#" giống với nội dung sau "id=".
    • Nhập </a> sau khi nhập nội dung.
    Quảng cáo

Phương pháp 4 của 7:
Thêm gạch đầu dòng

  1. 1
    Chọn vị trí mà bạn muốn thêm gạch đầu dòng. Gạch đầu dòng thích hợp nhất với việc liệt kê thông tin hoặc tạo các bước theo thứ tự. Sau khi bạn xác định vị trí bên dưới đoạn văn bản cần thêm gạch đầu dòng, hãy tiếp tục các bước sau đây.
  2. 2
    Thêm hiệu ứng ngắt trang. Nhập <br> ở phía trên vị trí mà bạn muốn thêm danh sách gạch đầu dòng và ấn Enter.
  3. 3
    Tạo gạch đầu dòng đầu tiên. Nhập <li>nội dung</li> và ấn Enter, đừng quên thay "nội dung" bằng nội dung của gạch đầu dòng.
  4. 4
    Thêm nhiều gạch đầu dòng khác. Khi bạn sử dụng thẻ <li></li> cho các dòng nội dung, nội dung trong các thẻ sẽ có định dạng gạch đầu dòng.
  5. 5
    Tạo gạch đầu dòng phụ. Nhập <ul>nội dung</ul> và ấn Enter. Nội dung sẽ được thụt vào bên dưới gạch đầu dòng trước đó.
    • Nội dung được đặt trong thẻ <ul></ul> sẽ không có gạch đầu dòng phía trước.
  6. 6
    Đóng thẻ ngắt trang. Nếu trước đó bạn đã sử dụng thẻ ngắt trang, hãy nhập </br> và ấn Enter. Danh sách gạch đầu dòng sẽ hiển thị độc lập trên trang.
    Quảng cáo

Phương pháp 5 của 7:
Thêm hình ảnh

  1. 1
    Chọn vị trí thêm hình ảnh. Hình ảnh sẽ hiển thị tại vị trí mà bạn chọn nhập mã hình ảnh.
  2. 2
    Tạo thẻ hình ảnh. Để thực hiện việc này, bạn sẽ nhập <img nhưng không ấn Enter. Vì thẻ "image" (hình ảnh) là thẻ hoàn chỉnh độc lập và không cần thêm thẻ đóng.
  3. 3
    Thêm thẻ "source" (nguồn). Nhập src= sau thẻ <img, bạn nhớ thêm khoảng trắng giữa "img" và "src".
  4. 4
    Nhập địa chỉ của ảnh. Sao chép đường dẫn của ảnh mà bạn muốn thêm, rồi dán bên phải thẻ nguồn.
  5. 5
    Thêm thẻ "style" (kiểu). Nhập style=, rồi nhập width:px;height:px.
  6. 6
    Nhập kích thước của ảnh. Nhập chiều rộng của ảnh theo đơn vị pixel vào sau "width:", rồi nhập chiều cao của ảnh theo đơn vị pixel vào sau "height:".
  7. 7
    Nhập thông tin mô tả thay thế. Đây là nội dung xuất hiện khi ảnh gặp lỗi hiển thị. Để thực hiện việc này, bạn cần nhập alt= và nhập mô tả.
  8. 8
    Đóng thẻ hình ảnh. Đặt dấu ngoặc > sau ký tự cuối cùng trong phần mô tả thay thế.
  9. 9
    Xem lại mã hình ảnh. Phần mã sẽ trông giống như sau:
    • <img src=https://www.w3schools.com/w3css/img_fjords.jpg style=width:600px;height:400px alt=Fjord>
    Quảng cáo

Phương pháp 6 của 7:
Lưu văn bản trên Windows

  1. 1
    Nhấp vào File (Tệp). Đây là lựa chọn ở phía trên góc trái cửa sổ Notepad. Màn hình liền hiển thị một trình đơn.
  2. 2
    Nhấp vào Save As… (Lưu thành…). Đây là lựa chọn ở gần phía trên trình đơn File đang hiển thị.
  3. 3
    Chọn thư mục lưu. Bạn chỉ cần nhấp vào một thư mục ở bên trái cửa sổ (chẳng hạn như Desktop).
  4. 4
    Đặt tên cho tập tin HTML. Bạn có thể nhập tên bất kỳ cho tập tin cùng với đuôi .html vào trường "File name" (Tên tập tin).
    • Ví dụ: với tập tin có tên "meow", bạn sẽ nhập meow.html tại đây.
  5. 5
    Nhấp vào khung lựa chọn "Save as type" (Lưu theo định dạng). Một danh sách lựa chọn liền hiển thị tại đây.
  6. 6
    Nhấp vào All Files (Tất cả tập tin) trong danh sách lựa chọn.
  7. 7
    Nhấp vào Save (Lưu). Bạn sẽ thấy lựa chọn này ở bên dưới góc phải cửa sổ. Đây là thao tác lưu tập tin dưới dạng trang HTML.
    • Bạn có thể mở tập tin trang HTML trong hầu hết trình duyệt bằng cách nhấp và kéo tập tin vào cửa sổ trình duyệt.
    Quảng cáo

Phương pháp 7 của 7:
Lưu văn bản trên Mac

  1. 1
    Nhấp vào TextEdit. Đó là lựa chọn ở phía trên góc trái màn hình. Một danh sách lựa chọn liền hiển thị tại đây.
  2. 2
    Nhấp vào Preferences… (Tùy chọn). Lựa chọn này ở gần phía trên danh sách đang hiển thị. Cửa sổ Preferences sẽ xuất hiện ngay.
  3. 3
    Nhấp vào thẻ Open and Save (Mở và Lưu) ở đầu trang.
  4. 4
    Bỏ chọn ô "Add ".txt" extension to plain text files" (Thêm đuôi ".txt" vào tập tin văn bản thuần túy). Đây là lựa chọn bên dưới tiêu đề "When Saving a File" (Khi lưu tập tin).
  5. 5
    Đóng cửa sổ Preferences. Nhấp vào vòng tròn đỏ ở phía trên góc trái cửa sổ để thực hiện việc này.
  6. 6
    Nhấp vào Format (Định dạng). Lựa chọn này ở phía trên màn hình.
  7. 7
    Nhấp vào Make Plain Text (Tạo văn bản thuần túy) trong trình đơn đang hiển thị.
  8. 8
    Nhấp vào File (Tệp). Đây là lựa chọn ở phía trên góc trái màn hình.
  9. 9
    Nhấp vào Save (Lưu). Lựa chọn này ở gần phía trên trình đơn đang hiển thị.
  10. 10
    Đặt tên cho tập tin HTML. Thay tên tại trường "Save As" (Lưu thành) bằng tên mà bạn thích và theo sau đó là đuôi .html.
    • Ví dụ, với văn bản có tên "my_website", bạn sẽ nhập my_website.html tại đây.
  11. 11
    Nhấp vào Save (Lưu). Văn bản HTML sẽ được lưu trong thư mục lưu mặc định (chẳng hạn như Desktop).
    • Bạn có thể mở tập tin trang HTML trong hầu hết trình duyệt bằng cách nhấp và kéo tập tin vào cửa sổ trình duyệt.
    Quảng cáo

Lời khuyên

  • Sử dụng chương trình chỉnh sửa mã chuyên biệt như Notepad++ sẽ giúp cho việc nhập HTML trở nên dễ dàng hơn và thuận tiện hơn so với khi dùng Notepad hoặc TextEdit.

Cảnh báo

  • Luôn kiểm tra lại mã trước khi tải lên trang web.

Bài viết wikiHow có liên quan

Trò chuyện trên TinderTrò chuyện trên Tinder
Tìm xem Ai đã Chặn bạn trên FacebookTìm xem Ai đã Chặn bạn trên Facebook
Tìm kiếm bằng Hình ảnh trên GoogleTìm kiếm bằng Hình ảnh trên Google
Khắc phục lỗi không thể truy cập vào một trang webKhắc phục lỗi không thể truy cập vào một trang web
Đặt tên kênh YouTube hayĐặt tên kênh YouTube hay
Tìm kiếm thông tin về ai đó bằng hình ảnhTìm kiếm thông tin về ai đó bằng hình ảnh
Kết nối PC với mạngKết nối PC với mạng
Kết nối mạng cho máy tính thông qua điện thoại di độngKết nối mạng cho máy tính thông qua điện thoại di động
Đào BitcoinĐào Bitcoin
Biết nếu ai đó chặn bạn trên Facebook MessengerBiết nếu ai đó chặn bạn trên Facebook Messenger
Chép và dán liên kếtChép và dán liên kết
Chặn và bỏ chặn người dùng trên InstagramChặn và bỏ chặn người dùng trên Instagram
Bỏ chặn Ai đó trên FacebookBỏ chặn Ai đó trên Facebook
Sử dụng OmegleSử dụng Omegle
Quảng cáo

Về bài wikiHow này

Nhân viên của wikiHow
Cùng viết bởi:
Bài viết này có đồng tác giả là đội ngũ biên tập viên và các nhà nghiên cứu đã qua đào tạo, những người xác nhận tính chính xác và toàn diện của bài viết.

Nhóm Quản lý Nội dung của wikiHow luôn cẩn trọng giám sát công việc của các biên tập viên để đảm bảo rằng mọi bài viết đều đạt tiêu chuẩn chất lượng cao. Bài viết này đã được xem 7.144 lần.
Chuyên mục: Mạng Internet
Trang này đã được đọc 7.144 lần.

Bài viết này đã giúp ích cho bạn?

Quảng cáo