Hướng dẫn how do i create a webpage using html and css on notepad? - làm cách nào để tạo trang web bằng html và css trên notepad?

Một trình soạn thảo văn bản đơn giản là tất cả những gì bạn cần để học HTML.

Tìm hiểu HTML bằng Notepad hoặc Textedit

Các trang web có thể được tạo và sửa đổi bằng cách sử dụng các biên tập viên HTML chuyên nghiệp.

Tuy nhiên, để học HTML, chúng tôi đề xuất một trình soạn thảo văn bản đơn giản như Notepad (PC) hoặc Textedit (MAC).

Chúng tôi tin rằng sử dụng một trình soạn thảo văn bản đơn giản là một cách tốt để học HTML.

Thực hiện theo các bước bên dưới để tạo trang web đầu tiên của bạn với Notepad hoặc Textedit.

Bước 1: Mở Notepad (PC)

Windows 8 trở lên:

Mở màn hình bắt đầu (biểu tượng cửa sổ ở phía dưới bên trái trên màn hình của bạn). Loại Notepad.Start Screen (the window symbol at the bottom left on your screen). Type Notepad.

Windows 7 trở lên:

Mở Bắt đầu> Chương trình> Phụ kiện> NotepadStart > Programs > Accessories > Notepad

Bước 1: Mở Textedit (Mac)

Open Finder> Ứng dụng> TexteditFinder > Applications > TextEdit

Đồng thời thay đổi một số tùy chọn để có được ứng dụng để lưu chính xác các tệp. Trong Tùy chọn> Định dạng> Chọn "Văn bản thuần túy"In Preferences > Format > choose "Plain Text"

Sau đó, trong "Mở và lưu", hãy chọn hộp có nội dung "Hiển thị các tệp HTML dưới dạng mã HTML thay vì văn bản được định dạng".

Sau đó mở một tài liệu mới để đặt mã.

Bước 2: Viết một số HTML

Viết hoặc sao chép mã HTML sau vào Notepad:

Tiêu đề đầu tiên của tôi

Đoạn đầu tiên của tôi.

Bước 3: Lưu trang HTML

Lưu tệp trên máy tính của bạn. Chọn Tệp> Lưu như trong menu Notepad.File > Save as in the Notepad menu.

Đặt tên cho tệp "index.htm" và đặt mã hóa thành UTF-8 (đây là mã hóa ưa thích cho các tệp HTML)."index.htm" and set the encoding to UTF-8 (which is the preferred encoding for HTML files).

Mẹo: Bạn có thể sử dụng .htm hoặc .html làm tiện ích mở rộng tệp. Không có sự khác biệt; điều đó phụ thuộc vào bạn. You can use either .htm or .html as file extension. There is no difference; it is up to you.

Bước 4: Xem trang HTML trong trình duyệt của bạn

Mở tệp HTML đã lưu trong trình duyệt yêu thích của bạn (nhấp đúp vào tệp hoặc nhấp chuột phải - và chọn "Mở bằng").

Kết quả sẽ trông giống như thế này:

Biên tập viên trực tuyến W3Schools - "Hãy tự mình thử"

Với trình chỉnh sửa trực tuyến miễn phí của chúng tôi, bạn có thể chỉnh sửa mã HTML và xem kết quả trong trình duyệt của bạn.

Nó là công cụ hoàn hảo khi bạn muốn kiểm tra mã nhanh. Nó cũng có mã hóa màu và khả năng lưu và chia sẻ mã với những người khác:test code fast. It also has color coding and the ability to save and share code with others:

Thí dụ

Tiêu đề trang

Đây là một tiêu đề này là một đoạn văn.

This is a paragraph.

Tiêu đề đầu tiên của tôi

Đoạn đầu tiên của tôi.

W3Schools Spaces

Bước 3: Lưu trang HTMLfree website builder, called W3schools Spaces:

Xin chào, các bạn chào đón. Trong hướng dẫn này, chúng tôi sẽ biết cách tạo một trang web bằng HTML trên trình soạn thảo văn bản Notepad.

Các bước chúng ta sẽ nói trong hướng dẫn này:

Bước 1. Mở Notepad.

Bước 2. Tạo tệp HTML.

Bước 3. Chèn các phần tử HTML bằng thẻ HTML.

Bước 4. Lưu và chạy tệp HTML.

Bước 5. Tận hưởng trang web của bạn.

Thêm các tiêu đề và đoạn văn

Thêm các tiêu đề trong HTML

Để chèn các tiêu đề trong HTML, chúng tôi có sáu thẻ cho điều đó. Từ H1 đến H6. Trong đó H6 cung cấp kích thước phông chữ tiêu đề nhỏ nhất và H1 cung cấp kích thước phông chữ tiêu đề lớn nhất.

  
    
  
  
    
    
Headline 1
    
Headline 2
    
Headline h3
    
Headline 4
    
Headline 5
    
Headline 6
        
  

Thêm đoạn văn trong HTML

Để thêm các đoạn văn trong HTML, chúng tôi có thẻ P cho điều đó.

   
    
    
This is My First HTML Paragraph
        
  

Thêm hình ảnh

Thêm hình ảnh trong HTML:

Bằng cách sử dụng thẻ IMG của HTML, chúng ta có thể chèn hình ảnh vào đường dẫn hình ảnh HTML.Provide bên trong thuộc tính SRC. Để tùy chỉnh chiều rộng chiều cao hình ảnh, chúng ta có các thuộc tính chiều rộng chiều cao của HTML.
Provide Image path inside the SRC Attribute.
For Image Height Width Customization we Have HTML's Height Width Attributes.

Thêm hình ảnh nền trong HTML:

Để thêm hình ảnh nền vào trang web, chúng tôi phải sử dụng thuộc tính nền của HTML bên trong thẻ bắt đầu cơ thể. Và bên trong thuộc tính nền, chúng tôi phải đưa ra đường dẫn của hình ảnh.
And inside the background attribute, we have to give our Image's Path.

Thêm tệp âm thanh và video:

Thêm tệp âm thanh trong HTML:

Để chèn tệp âm thanh vào HTML, chúng tôi có thẻ âm thanh cho đó. Bên trong thuộc tính SRC, chúng tôi phải cung cấp cho thuộc tính Path của tệp âm thanh của chúng tôi.
Inside the SRC attribute, we have to Give our Audio file's Path.
Controls attribute will give us some controls to Control Audio File on our HTML File.

Thêm tệp video trong HTML:

Để chèn tệp âm thanh vào HTML, chúng tôi có thẻ video cho đó. Bên trong thuộc tính SRC, chúng tôi phải cung cấp cho bản dẫn của tệp video của chúng tôi.
Inside the SRC attribute, we have to Give our Video file's Path.
Controls attribute will give us some controls to Control Video File on our HTML File.

Các yếu tố HTML kiểu dáng:

Để tạo các yếu tố HTML, chúng tôi sử dụng CSS.

Bao gồm CSS trong trang web HTML:

Để bao gồm CSS trong HTML, chúng tôi phải viết thẻ kiểu HTML bên trong các thẻ tiêu đề.

Chọn các phần tử HTML trong CSS:

Chọn phần tử HTML bằng tên thẻ:

  
      
    
        
  
   
    
 Paragraph Text...
  

Chọn phần tử HTML bằng tên ID:

  
      
    
        
  
   
    
 Paragraph Text...
  

Chọn phần tử HTML bằng tên lớp:

  
    
      
        
        
    
     
      
 Paragraph Text...
    
  

Kiểu HTML sử dụng CSS:

Thay đổi kích thước phông chữ bằng CSS:

   
    
    
This is My First HTML Paragraph
        
  

Thay đổi màu phông chữ bằng CSS:

   
    
    
This is My First HTML Paragraph
        
  

Thay đổi màu nền bằng CSS:

   
    
    
This is My First HTML Paragraph
        
  

Thay đổi căn chỉnh văn bản bằng CSS:

   
    
    
This is My First HTML Paragraph
        
  

Thay đổi độ mờ bằng CSS:

   
    
    
This is My First HTML Paragraph
        
  

Thay đổi lề bằng CSS:

   
    
    
This is My First HTML Paragraph
        
  

Thay đổi phần đệm bằng CSS:

   
    
    
This is My First HTML Paragraph
        
  

Thay đổi chiều rộng bằng CSS:

   
    
    
This is My First HTML Paragraph
        
  

Thay đổi chiều cao bằng CSS:

   
    
    
This is My First HTML Paragraph
        
  

Thay đổi chiều cao dòng của văn bản bằng CSS:

   
    
    
This is My First HTML Paragraph
        
  

Làm cách nào để tạo một trang web bằng Notepad trong HTML?

Làm thế nào để bạn mã HTML trong notepad?

Làm cách nào để tạo trang web của riêng mình bằng HTML và CSS?

Notepad ++ có tốt cho HTML và CSS không?