Html trên một trang web ở đâu?

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

Sau đó, bên dưới "Mở và lưu", chọn hộp có nội dung "Hiển thị 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


Html trên một trang web ở đâu?



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 dưới dạng trong menu Notepad

Đặt tên tệp là "index. htm" và đặt mã hóa thành UTF-8 (là mã hóa ưu tiên cho các tệp HTML)

Html trên một trang web ở đâu?

Mẹo. Bạn có thể sử dụng một trong hai. htm hoặc. html dưới dạng phần mở rộng tệp. Không có sự khác biệt;


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ẽ giống như thế này

Html trên một trang web ở đâu?


W3Schools Online Editor - "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 mình

Nó là công cụ hoàn hảo khi bạn muốn kiểm tra mã nhanh. Nó cũng có mã màu và khả năng lưu và chia sẻ mã với người khác

Thí dụ




Tiêu đề trang

Đây là một tiêu đề

Đây là một đoạn


Tự mình thử »

Nhấp vào nút "Tự dùng thử" để xem nó hoạt động như thế nào


Không gian W3Schools

Nếu bạn muốn tạo trang web của riêng mình và lưu mã trực tuyến, hãy thử trình tạo trang web của chúng tôi, được gọi là W3schools Spaces

bài 9. Khám phá HTML trên các trang web trực tiếp

/en/basic-html/metadata-and-the-head-element/content/

Bài học này là một phần của loạt bài về lập trình máy tính. Bạn có thể chuyển đến Giới thiệu về lập trình nếu muốn bắt đầu từ đầu

Khi bạn đã nắm được cách viết HTML cơ bản, bạn có thể tự hỏi nó liên quan như thế nào đến các trang web bạn xem hàng ngày. May mắn thay, bạn có thể xem HTML tạo nên bất kỳ trang web cụ thể nào trong trình duyệt của mình và nó không yêu cầu bất kỳ công cụ đặc biệt nào. Tất cả những gì bạn cần sử dụng là nguồn trang xem tích hợp và kiểm tra các tùy chọn thành phần

Html trên một trang web ở đâu?

Những gì bạn sẽ thấy

Trước khi bạn bắt đầu khám phá HTML của các trang web khác, điều quan trọng là phải có một số ngữ cảnh cho những gì bạn đang thấy. Một số trang web có HTML đơn giản trông tương tự như những gì bạn đã làm cho đến nay, nhưng nhiều trang web khác thì không. Ví dụ: HTML của các trang web nổi tiếng như Amazon hoặc Google có thể dày đặc và không thể đọc được khiến nó trông hoàn toàn khác. Tùy thuộc vào trang web, có thể có nhiều lý do khác nhau cho việc này, nhưng một trong những lý do lớn nhất và phổ biến nhất là thu nhỏ

Thu nhỏ đề cập đến quá trình mã máy tính—HTML, giống như bạn đang viết, hoặc thậm chí CSS hoặc JavaScript—được nén tự động để giảm kích thước tệp. Mọi định dạng đã được đưa vào để giúp con người dễ đọc mã hơn sẽ bị xóa vì trình duyệt của bạn không cần định dạng đó. Việc xóa nội dung cũng làm cho tệp nhỏ hơn và tệp càng nhỏ thì trình duyệt của bạn tải tệp càng nhanh. Ví dụ: bạn có thể thu nhỏ dự án mà bạn đang thực hiện và nó có thể giống như thế này

  Cinema Classics Movie Reviews   

Review: Basketball Dog (2018)

Html trên một trang web ở đâu?

4 out of 5 stars

From director Vicki Fleming comes the heartwarming tale of a boy named Pete (Trent Dugson) and his dog Rover (voiced by Brinson Lumblebrunt). You may think a boy and his dog learning the true value of friendship sounds familiar, but a big twist sets this flick apart: Rover plays basketball, and he's doggone good at it.

This movie has everything you could ask for:

  • Basketball
  • A dog
  • Nail-biting suspense

While it may not have been necessary to include all 150 minutes of Rover's championship game in real time, Basketball Dog will keep your interest for the entirety of its 4-hour runtime, and the end will have any dog lover in tears. If you love basketball or sports pets, this is the movie for you.

Find the full cast listing at the Basketball Dog website.

Show Next Review

Tuy nhiên, thông thường hơn, bạn sẽ thấy các trang web bao gồm JavaScript hoặc CSS được rút gọn cùng với HTML của chúng. Ví dụ: bạn có thể xem một trang web như Google và nghĩ rằng nó trông khá đơn giản vì không có nhiều thông tin trên trang.  

Html trên một trang web ở đâu?

Tuy nhiên, nếu bạn xem mã nguồn của trang, bạn sẽ ngay lập tức bắt gặp thứ trông giống như một mớ mã khó hiểu

Html trên một trang web ở đâu?

Điều quan trọng cần nhớ là bạn không nên sợ hãi hoặc choáng ngợp khi nhìn thấy thứ gì đó như vậy. Thật dễ dàng để tưởng tượng rằng một lập trình viên thiên tài nào đó đã viết tất cả chính xác như bạn thấy, nhưng thực tế là có rất nhiều thứ đã được thực hiện với mã mà bạn thấy trên các trang web phổ biến để giúp mã tải nhanh hơn. Mọi thứ ban đầu làm cho nó có thể đọc được thường bị xóa và nó trông giống như một mớ mã không thể hiểu được ngay cả với một lập trình viên có kinh nghiệm.  

Nói tóm lại, việc xem mã cơ bản của các trang web hiện có có thể rất hữu ích, nhưng đừng để bất kỳ điều gì bạn nhìn thấy làm bạn nản lòng. Nó hiếm khi phức tạp như vẻ ngoài của nó, ngay cả khi thoạt nhìn điều đó dường như là không thể

Xem nguồn trang

Cách đơn giản nhất để xem HTML của trang web là tùy chọn xem nguồn trang hoặc xem nguồn. Hầu hết các trình duyệt chính—Chrome, Firefox hoặc Edge—bao gồm nó như một tùy chọn trình duyệt cơ bản mà không cần bất kỳ thiết lập nào. Quá trình này tương tự trong hầu hết các trình duyệt, nhưng trong Chrome, bạn chỉ cần nhấp chuột phải vào bất kỳ đâu trên trang web và chọn Xem nguồn trang

Html trên một trang web ở đâu?

Điều này cung cấp cho bạn chế độ xem chính xác tài liệu HTML mà trình duyệt của bạn đang đọc. Tùy thuộc vào trang web, nó có thể là một cái nhìn hữu ích về cấu trúc của HTML. Tuy nhiên, trong một số trường hợp, nó có thể rất lộn xộn.

Kiểm tra nguyên tố

Một công cụ giàu tính năng và hợp lý hơn để xem HTML của trang web là công cụ kiểm tra phần tử. Công cụ này cũng được tích hợp trong hầu hết các trình duyệt chính, mặc dù một số—đặc biệt là Safari—yêu cầu một số cấu hình cài đặt để có thể sử dụng công cụ này. Trong Chrome, tất cả những gì bạn cần làm là nhấp chuột phải vào bất kỳ đâu trên trang web mà bạn muốn xem HTML, sau đó chọn Kiểm tra

Một cửa sổ kiểm tra sẽ mở ra, thường được gắn ở dưới cùng hoặc bên phải của cửa sổ trình duyệt của bạn. Có vẻ hơi khác nhau trong mỗi trình duyệt, nhưng các chức năng cơ bản luôn giống nhau. Có rất nhiều thứ để xem, nhưng đừng lo lắng, vì hiện tại chỉ có phần HTML của nó là phù hợp với bạn. Trong Chrome, nó trông như thế này

Html trên một trang web ở đâu?

Đừng bị choáng ngợp bởi bao nhiêu thứ bạn thấy trong cửa sổ thanh tra mà bạn không hiểu. Mục đích của nó là cung cấp nhiều công cụ mà người ta cuối cùng có thể cần để phát triển web trong mọi tình huống khác nhau, nhưng phần lớn trong số đó sẽ không phù hợp với bạn cho đến khi bạn tìm hiểu về CSS và JavaScript, và một số thậm chí còn không.

Trong cửa sổ trình kiểm tra, bạn có thể thấy tất cả HTML của trang được trình bày với các vết lõm gọn gàng, dễ đọc. Bạn cũng có thể sử dụng các mũi tên bên cạnh mỗi phần tử để mở rộng và thu gọn chúng, cho phép bạn hiển thị hoặc ẩn các phần tử chứa trong đó

Html trên một trang web ở đâu?

Tuy nhiên, một trong những điều hữu ích nhất về cửa sổ trình kiểm tra là bạn có thể sử dụng nó để xem kết nối giữa một phần tử HTML và cách nó xuất hiện trên trang trong thời gian thực. Khi bạn di con trỏ qua một phần tử trong cửa sổ trình kiểm tra, phần tử tương ứng sẽ được đánh dấu trên trang web thực tế

Html trên một trang web ở đâu?

Khi bạn cảm thấy thoải mái với cửa sổ trình kiểm tra, bạn sẽ có thể tự do khám phá HTML của các trang web bạn truy cập hàng ngày và xem cấu trúc cơ bản của chúng tạo nên những gì bạn thấy trên trang như thế nào

Thử cái này

Để kiểm tra kỹ năng kiểm tra HTML mới của bạn, hãy xem lại dự án mà bạn đang thực hiện. Thực hiện theo các bước sau