Freecodecamp html cơ bản

Bạn có thể xây dựng các biểu mẫu web thực sự gửi dữ liệu đến máy chủ mà không cần sử dụng gì khác ngoài HTML thuần túy. Bạn có thể làm điều này bằng cách chỉ định một hành động trên thành phần biểu mẫu của mình

Show

Ví dụ

<form action="/url-where-you-want-to-submit-form-data"></form>

Lồng trường văn bản của bạn vào bên trong thành phần biểu mẫu và thêm thuộc tính action="/submit-cat-photo" vào thành phần biểu mẫu

Hướng dẫn và giải pháp. Bài viết này sẽ hướng dẫn bạn qua freecodecamp. org Thử thách “HTML cơ bản và HTML5”

Freecodecamp html cơ bản

Lưu ý rằng các phần tử img là tự đóng

Tất cả các phần tử img phải có thuộc tính alt. Văn bản bên trong thuộc tính alt được sử dụng cho trình đọc màn hình để cải thiện khả năng truy cập và được hiển thị nếu hình ảnh không tải được

Ghi chú. Nếu hình ảnh chỉ mang tính chất trang trí, sử dụng thuộc tính alt trống là cách tốt nhất

Lý tưởng nhất là thuộc tính alt không nên chứa các ký tự đặc biệt trừ khi cần thiết

✅ Solution →

Freecodecamp html cơ bản
0 hoặc danh sách được đánh số

Danh sách được sắp xếp bắt đầu bằng phần tử <img src="https://www.your-image-source.com/your-image.jpg">1 mở, theo sau là bất kỳ số lượng phần tử src8 nào. Cuối cùng, các danh sách được sắp xếp đóng lại bằng một <img src="https://www.your-image-source.com/your-image.jpg">3

✅ Giải pháp →


  1. Garfield

  2. Sylvester

  3. Water

17. Tạo một trường văn bản

💡Các yếu tố đầu vào là một cách thuận tiện để nhận thông tin đầu vào từ người dùng của bạn. Bạn có thể tạo một kiểu nhập văn bản như thế này

<img src="https://www.your-image-source.com/your-image.jpg">4

Lưu ý rằng các phần tử <img src="https://www.your-image-source.com/your-image.jpg">5 là tự đóng

✅ Solution →

18. Thêm văn bản giữ chỗ vào trường văn bản

💡 Văn bản giữ chỗ là nội dung được hiển thị trong phần tử <img src="https://www.your-image-source.com/your-image.jpg">5 của bạn trước khi người dùng của bạn nhập bất kỳ nội dung nào

Bạn có thể tạo văn bản giữ chỗ như vậy

<img src="https://www.your-image-source.com/your-image.jpg">7

✅ Solution →

19. Tạo một phần tử biểu mẫu

💡 Bạn có thể tạo các biểu mẫu web thực sự gửi dữ liệu đến máy chủ mà không cần sử dụng gì khác ngoài HTML thuần túy. Bạn có thể làm điều này bằng cách chỉ định một hành động trên phần tử <img src="https://www.your-image-source.com/your-image.jpg">8 của bạn

✅ Giải pháp →



20. Thêm nút gửi vào biểu mẫu

💡 Nhấp vào nút gửi sẽ gửi dữ liệu từ biểu mẫu của bạn đến URL bạn đã chỉ định với thuộc tính ________ 59 của công ty bạn

✅ Solution →

21. Sử dụng HTML5 để yêu cầu một trường

💡 Bạn có thể yêu cầu các trường biểu mẫu cụ thể để người dùng của bạn không thể gửi biểu mẫu của bạn cho đến khi họ điền vào chúng

✅ Solution →

22. Tạo một tập hợp các nút radio

💡Bạn có thể sử dụng img0 cho những câu hỏi mà bạn muốn người dùng chỉ đưa ra một câu trả lời trong số nhiều lựa chọn

Các nút radio là một loại <img src="https://www.your-image-source.com/your-image.jpg">5

Mỗi nút radio của bạn có thể được lồng trong phần tử img2 của chính nó. Bằng cách bọc phần tử <img src="https://www.your-image-source.com/your-image.jpg">5 bên trong phần tử img2, nó sẽ tự động liên kết đầu vào nút radio với phần tử nhãn bao quanh nó

Tất cả các nút radio liên quan phải có cùng thuộc tính ________ 35 để tạo nhóm nút radio. Bằng cách tạo một nhóm radio, việc chọn bất kỳ nút radio nào sẽ tự động bỏ chọn các nút khác trong cùng một nhóm để đảm bảo người dùng chỉ cung cấp một câu trả lời

Phương pháp hay nhất được coi là đặt thuộc tính img6 trên phần tử img2, với giá trị khớp với giá trị của thuộc tính -->7 của phần tử <img src="https://www.your-image-source.com/your-image.jpg">5. Điều này cho phép các công nghệ hỗ trợ tạo mối quan hệ liên kết giữa nhãn và phần tử <img src="https://www.your-image-source.com/your-image.jpg">5 con

✅ Giải pháp →

23. Tạo một tập hợp các hộp kiểm

💡Các biểu mẫu thường sử dụng img1 cho các câu hỏi có thể có nhiều hơn một câu trả lời

Hộp kiểm là một loại <img src="https://www.your-image-source.com/your-image.jpg">5

Mỗi hộp kiểm của bạn có thể được lồng trong phần tử img2 của chính nó. Bằng cách bọc một phần tử <img src="https://www.your-image-source.com/your-image.jpg">5 bên trong một phần tử img2, nó sẽ tự động liên kết đầu vào hộp kiểm với phần tử nhãn bao quanh nó

Tất cả các đầu vào hộp kiểm liên quan phải có cùng thuộc tính img5

Phương pháp hay nhất được coi là xác định rõ ràng mối quan hệ giữa hộp kiểm <img src="https://www.your-image-source.com/your-image.jpg">5 và hộp kiểm img2 tương ứng của nó bằng cách đặt thuộc tính img6 trên phần tử img2 để khớp với thuộc tính -->7 của phần tử <img src="https://www.your-image-source.com/your-image.jpg">5 được liên kết

✅ Giải pháp →



24. Kiểm tra các nút radio và hộp kiểm theo mặc định

💡Bạn có thể đặt hộp kiểm hoặc nút radio được kiểm tra theo mặc định bằng cách sử dụng thuộc tính alt3

Để làm điều này, chỉ cần thêm từ “đã kiểm tra” vào bên trong phần tử đầu vào

✅ Giải pháp →







25. Lồng nhiều phần tử trong một phần tử div

💡Phần tử alt4, còn được gọi là phần tử phân chia, là nơi chứa mục đích chung cho các phần tử khác

Phần tử alt4 có lẽ là phần tử HTML được sử dụng phổ biến nhất trong tất cả các phần tử

Giống như bất kỳ phần tử không tự đóng nào khác, bạn có thể mở một phần tử _____ 84 bằng ________ 87 và đóng nó trên một dòng khác bằng alt8

✅ Solution →

    ….

    26. Khai báo Doctype của tài liệu HTML

    💡Các thử thách cho đến nay đã đề cập đến các thành phần HTML cụ thể và cách sử dụng chúng. Tuy nhiên, có một số yếu tố cung cấp cấu trúc tổng thể cho trang của bạn và nên được đưa vào mọi tài liệu HTML

    Ở đầu tài liệu, bạn cần cho trình duyệt biết phiên bản HTML mà trang của bạn đang sử dụng. HTML là một ngôn ngữ đang phát triển và được cập nhật thường xuyên. Hầu hết các trình duyệt chính đều hỗ trợ thông số kỹ thuật mới nhất, đó là HTML5. Tuy nhiên, các trang web cũ hơn có thể sử dụng các phiên bản trước của ngôn ngữ

    Bạn cho trình duyệt biết thông tin này bằng cách thêm thẻ alt9 vào dòng đầu tiên, trong đó phần "alt0" là phiên bản của HTML. Đối với HTML5, bạn sử dụng alt1

    alt2 và chữ hoa alt3 rất quan trọng, đặc biệt đối với các trình duyệt cũ hơn. alt4 không phân biệt chữ hoa chữ thường

    Tiếp theo, phần còn lại của mã HTML của bạn cần được bọc trong các thẻ alt4. Phần mở đầu alt6 nằm ngay bên dưới dòng alt1 và phần kết thúc alt8 nằm ở cuối trang

    ✅ Giải pháp →



    Hi!


    27. Xác định phần đầu và phần thân của tài liệu HTML

    💡 Bạn có thể thêm một cấp độ tổ chức khác vào tài liệu HTML của mình trong các thẻ ________ 84 với các phần tử ________ 80 và ________ 81. Mọi đánh dấu có thông tin về trang của bạn sẽ được đưa vào thẻ alt0. Sau đó, bất kỳ đánh dấu nào với nội dung của trang (nội dung hiển thị cho người dùng) sẽ đi vào thẻ alt1

    Các phần tử siêu dữ liệu, chẳng hạn như alt4, alt5, alt6 và alt7, thường nằm bên trong phần tử alt0

    ✅ Giải pháp →


    The best page ever


    . Đi vào một căn phòng để quyết định dù sao bạn cũng không muốn ở trong đó. Tôi thích những con mèo lớn và tôi không thể nói dối mèo con ipsum dolor sit amet, đổ khắp nơi đổ khắp nơi kéo dài tấn công mắt cá chân của bạn đuổi theo chấm đỏ, tóc bóng chạy catnip ăn cỏ hít. Meow tôi có thể tè vào cái này nếu tôi có năng lượng để tát vào mặt chủ sở hữu lúc 5 giờ sáng cho đến khi con người lấp đầy đĩa thức ăn. Đập bát đĩa ra khỏi bàn, đầu mông không thể ăn hết đĩa của mình, cào xước đồ đạc. Làm meme, làm mặt dễ thương. Đuổi theo tia laser trong bồn tắm ngủ nhưng tè vào giày. Vuốt vào cái bụng mỡ của bạn liếm mặt bạn và ăn cỏ, ném nó trở lại mèo con ipsum dolor ngồi amet, đổ khắp nơi đổ khắp nơi kéo dài tấn công mắt cá chân của bạn đuổi theo chấm đỏ, tóc bóng chạy catnip ăn cỏ hít.

    The best page ever


    Cat ipsum dolor sit amet, jump launch to pounce upon little yarn mouse, bare fangs at toy run hide in litter box until treats are fed. Go into a room to decide you didn’t want to be in there anyway. I like big cats and i can not lie kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff. Meow i could pee on this if i had the energy for slap owner’s face at 5am until human fills food dish yet scamper. Knock dish off table head butt cant eat out of my own dish scratch the furniture. Make meme, make cute face. Sleep in the bathroom sink chase laser but pee in the shoe. Paw at your fat belly licks your face and eat grass, throw it back up kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.


    Bạn vẫn ở đây chứ?. Vâng, nếu bạn là, xin chúc mừng. Bạn vừa hoàn thành khóa học “Giới thiệu về HTML cơ bản & HTML5” của freecodecamp

    Nếu bạn quan tâm đến các thử thách và giải pháp freeCodeCamp khác, bạn có thể xem các bài viết trong hồ sơ của tôi

    Bạn có thể học HTML trên freeCodeCamp không?

    Nếu bạn muốn bắt đầu phát triển web, học HTML là nơi bắt đầu. Chúng tôi vừa xuất bản khóa học video HTML dành cho người mới bắt đầu trên freeCodeCamp. tổ chức kênh YouTube . (Và chúng tôi vẫn cung cấp khóa học HTML tương tác miễn phí. )

    13 tuổi có thể học HTML không?

    HTML và CSS là hai khối xây dựng cơ bản của tất cả các trang web trên mạng toàn cầu và khóa học này bao gồm các nguyên tắc cơ bản cốt lõi. Thanh thiếu niên trong độ tuổi 13-16 thuộc mọi khả năng đều được chào đón , từ những người mới bắt đầu (những người chưa bao giờ viết một dòng mã) cho đến những người có thể đã .

    HTML cơ bản có dễ học không?

    HTML có lẽ là một trong những ngôn ngữ lập trình giao diện người dùng dễ thành thạo nhất . Vì vậy, nếu bạn muốn học HTML, hãy học nó. Với sự kiên nhẫn và thực hành, bạn sẽ học cách tận dụng tối đa ngôn ngữ phổ biến này.

    Tôi có thể học HTML trong 5 ngày không?

    Bạn sẽ mất từ một đến hai tuần để nắm được toàn bộ ý chính của HTML và khoảng một tháng thực hành để làm quen với . Điều quan trọng là áp dụng việc học của bạn bằng cách làm việc trên các dự án.