search

Hướng dẫn line break css codepen - ngắt dòng css codepen

1 năms trước
Trả lời: 0
Lượt xem: 35

Show
Bài 2

Với phần giới thiệu của chúng tôi về HTML và CSS hoàn thành, đã đến lúc đào sâu hơn một chút vào HTML và kiểm tra các thành phần khác nhau tạo nên ngôn ngữ này.

Để bắt đầu xây dựng các trang web, chúng ta cần tìm hiểu một chút về các yếu tố HTML nào được sử dụng tốt nhất để hiển thị các loại nội dung khác nhau. Nó cũng rất quan trọng để hiểu làm thế nào các yếu tố được hiển thị trực quan trên một trang web, cũng như những yếu tố khác nhau có ý nghĩa gì về mặt ngữ nghĩa.

Sử dụng yếu tố thích hợp cho công việc đi một chặng đường dài và chúng tôi sẽ muốn đưa ra các quyết định được thông tin tốt trong quá trình này.

Tổng quan về ngữ nghĩa

Vậy chính xác thì ngữ nghĩa là gì? Ngữ nghĩa trong HTML là thực tiễn cung cấp nội dung trên ý nghĩa và cấu trúc trang bằng cách sử dụng phần tử thích hợp. Mã ngữ nghĩa mô tả giá trị của nội dung trên một trang, bất kể phong cách hay ngoại hình của nội dung đó. Có một số lợi ích khi sử dụng các yếu tố ngữ nghĩa, bao gồm cho phép máy tính, đầu đọc màn hình, công cụ tìm kiếm và các thiết bị khác để đọc và hiểu đầy đủ nội dung trên trang web. Ngoài ra, HTML ngữ nghĩa dễ dàng hơn để quản lý và làm việc, vì nó hiển thị rõ ràng mỗi phần nội dung là gì.

Tiến về phía trước, khi các yếu tố mới được giới thiệu, chúng tôi sẽ nói về những yếu tố đó thực sự có ý nghĩa gì và loại nội dung mà chúng đại diện tốt nhất. Tuy nhiên, trước khi chúng tôi làm điều đó, hãy để Lôi nhìn vào hai yếu tố, các yếu tố 50 và ____ 51s, thực sự không có giá trị ngữ nghĩa nào. Chúng chỉ tồn tại cho mục đích tạo kiểu.

Xác định các bộ phận & nhịp

Các bộ phận, hoặc 

<p>Steve Jobs was a co-founder and longtime chief executive officer at Apple. On June 12, 2005, Steve gave the commencement address at Stanford University.</p>

<p>In his address Steve urged graduates to follow their dreams and, despite any setbacks, to never give up&ndash;advice which he sincerely took to heart.</p>
0s và 
<p>Steve Jobs was a co-founder and longtime chief executive officer at Apple. On June 12, 2005, Steve gave the commencement address at Stanford University.</p>

<p>In his address Steve urged graduates to follow their dreams and, despite any setbacks, to never give up&ndash;advice which he sincerely took to heart.</p>
1 là các yếu tố HTML hoạt động như các container chỉ cho mục đích tạo kiểu. Là các thùng chứa chung, chúng không đi kèm với bất kỳ ý nghĩa bao quát hoặc giá trị ngữ nghĩa nào. Các đoạn văn có ngữ nghĩa trong nội dung đó được bọc trong một yếu tố 
<p>Steve Jobs was a co-founder and longtime chief executive officer at Apple. On June 12, 2005, Steve gave the commencement address at Stanford University.</p>

<p>In his address Steve urged graduates to follow their dreams and, despite any setbacks, to never give up&ndash;advice which he sincerely took to heart.</p>
4 được biết đến và được hiểu là một đoạn văn. 
<p>Steve Jobs was a co-founder and longtime chief executive officer at Apple. On June 12, 2005, Steve gave the commencement address at Stanford University.</p>

<p>In his address Steve urged graduates to follow their dreams and, despite any setbacks, to never give up&ndash;advice which he sincerely took to heart.</p>
0s và 
<p>Steve Jobs was a co-founder and longtime chief executive officer at Apple. On June 12, 2005, Steve gave the commencement address at Stanford University.</p>

<p>In his address Steve urged graduates to follow their dreams and, despite any setbacks, to never give up&ndash;advice which he sincerely took to heart.</p>
1s không giữ bất kỳ ý nghĩa nào như vậy và chỉ đơn giản là các container.

Khối so với các yếu tố nội tuyến

Hầu hết các yếu tố là các phần tử cấp khối hoặc nội tuyến. Có gì khác biệt?

Các phần tử cấp khối bắt đầu trên một dòng mới, xếp một dòng trên đầu kia và chiếm mọi chiều rộng có sẵn. Các phần tử cấp khối có thể được lồng bên trong nhau và có thể bao bọc các phần tử cấp nội tuyến. Chúng tôi thường thấy các yếu tố cấp độ khối được sử dụng cho các phần nội dung lớn hơn, chẳng hạn như các đoạn văn.

Các yếu tố cấp nội tuyến không bắt đầu trên một dòng mới. Chúng rơi vào dòng chảy bình thường của một tài liệu, xếp hàng lần lượt và chỉ duy trì chiều rộng nội dung của chúng. Các yếu tố cấp nội tuyến có thể được lồng bên trong nhau; Tuy nhiên, họ không thể bọc các yếu tố cấp khối. Chúng tôi thường thấy các yếu tố cấp nội tuyến với các phần nội dung nhỏ hơn, chẳng hạn như một vài từ.

Tuy nhiên, cả 

<p>Steve Jobs was a co-founder and longtime chief executive officer at Apple. On June 12, 2005, Steve gave the commencement address at Stanford University.</p>

<p>In his address Steve urged graduates to follow their dreams and, despite any setbacks, to never give up&ndash;advice which he sincerely took to heart.</p>
0 và 
<p>Steve Jobs was a co-founder and longtime chief executive officer at Apple. On June 12, 2005, Steve gave the commencement address at Stanford University.</p>

<p>In his address Steve urged graduates to follow their dreams and, despite any setbacks, to never give up&ndash;advice which he sincerely took to heart.</p>
1 đều cực kỳ có giá trị khi xây dựng một trang web ở chỗ chúng cho chúng tôi khả năng áp dụng các kiểu được nhắm mục tiêu vào một tập hợp nội dung.

<p>Steve Jobs was a co-founder and longtime chief executive officer at Apple. On June 12, 2005, Steve gave the commencement address at Stanford University.</p>

<p>In his address Steve urged graduates to follow their dreams and, despite any setbacks, to never give up&ndash;advice which he sincerely took to heart.</p>
0 là một yếu tố cấp khối thường được sử dụng để xác định các nhóm nội dung lớn và giúp xây dựng một trang web bố cục và thiết kế trang web. Mặt khác, 
<p>Steve Jobs was a co-founder and longtime chief executive officer at Apple. On June 12, 2005, Steve gave the commencement address at Stanford University.</p>

<p>In his address Steve urged graduates to follow their dreams and, despite any setbacks, to never give up&ndash;advice which he sincerely took to heart.</p>
1 là một phần tử cấp nội tuyến thường được sử dụng để xác định các nhóm văn bản nhỏ hơn trong phần tử cấp khối.

Chúng tôi thường thấy các 

<p>Steve Jobs was a co-founder and longtime chief executive officer at Apple. On June 12, 2005, Steve gave the commencement address at Stanford University.</p>

<p>In his address Steve urged graduates to follow their dreams and, despite any setbacks, to never give up&ndash;advice which he sincerely took to heart.</p>
0 và 
<p>Steve Jobs was a co-founder and longtime chief executive officer at Apple. On June 12, 2005, Steve gave the commencement address at Stanford University.</p>

<p>In his address Steve urged graduates to follow their dreams and, despite any setbacks, to never give up&ndash;advice which he sincerely took to heart.</p>
1 với các thuộc tính 
1
2
3
4
5
6
3 hoặc 
1
2
3
4
5
6
4 cho mục đích tạo kiểu. Chọn một giá trị thuộc tính 
1
2
3
4
5
6
3 hoặc 
1
2
3
4
5
6
4, hoặc tên, đòi hỏi một chút chăm sóc. Chúng tôi muốn chọn một giá trị đề cập đến nội dung của một yếu tố, không nhất thiết là sự xuất hiện của một yếu tố.
Ví dụ: nếu chúng ta có một 
<p>Steve Jobs was a co-founder and longtime chief executive officer at Apple. On June 12, 2005, Steve gave the commencement address at Stanford University.</p>

<p>In his address Steve urged graduates to follow their dreams and, despite any setbacks, to never give up&ndash;advice which he sincerely took to heart.</p>

0 với nền màu cam chứa các liên kết truyền thông xã hội, suy nghĩ đầu tiên của chúng ta có thể là cung cấp cho 
<p>Steve Jobs was a co-founder and longtime chief executive officer at Apple. On June 12, 2005, Steve gave the commencement address at Stanford University.</p>

<p>In his address Steve urged graduates to follow their dreams and, despite any setbacks, to never give up&ndash;advice which he sincerely took to heart.</p>

0 giá trị 
1
2
3
4
5
6
3 là 
<!-- Strong importance -->
<p><strong>Caution:</strong> Falling rocks.</p>

<!-- Stylistically offset -->
<p>This recipe calls for <b>bacon</b> and <b>baconnaise</b>.</p>

0. Điều gì xảy ra nếu nền màu cam đó sau đó được đổi thành màu xanh? Có giá trị 
1
2
3
4
5
6
3 là 
<!-- Strong importance -->
<p><strong>Caution:</strong> Falling rocks.</p>

<!-- Stylistically offset -->
<p>This recipe calls for <b>bacon</b> and <b>baconnaise</b>.</p>

0 không còn có ý nghĩa. Một lựa chọn hợp lý hơn cho giá trị 
1
2
3
4
5
6
3 sẽ là 
<!-- Strong importance -->
<p><strong>Caution:</strong> Falling rocks.</p>

<!-- Stylistically offset -->
<p>This recipe calls for <b>bacon</b> and <b>baconnaise</b>.</p>

4, vì nó liên quan đến nội dung của 
<p>Steve Jobs was a co-founder and longtime chief executive officer at Apple. On June 12, 2005, Steve gave the commencement address at Stanford University.</p>

<p>In his address Steve urged graduates to follow their dreams and, despite any setbacks, to never give up&ndash;advice which he sincerely took to heart.</p>

0, không phải là phong cách.
Nhận xét trong HTML & CSS
Mã trước đó bao gồm các dấu chấm than trong HTML và điều đó đều ổn. Đó không phải là các yếu tố, đó là những bình luận.
HTML và CSS cho chúng tôi khả năng để lại nhận xét trong mã của chúng tôi và bất kỳ nội dung nào được bọc trong một bình luận sẽ không được hiển thị trên trang web. Nhận xét giúp giữ các tệp của chúng tôi được tổ chức, cho phép chúng tôi đặt lời nhắc và cung cấp một cách để chúng tôi quản lý mã hiệu quả hơn. Nhận xét trở nên đặc biệt hữu ích khi có nhiều người làm việc trên cùng một tệp.
Nhận xét HTML bắt đầu với 
<!-- Strong importance -->
<p><strong>Caution:</strong> Falling rocks.</p>

<!-- Stylistically offset -->
<p>This recipe calls for <b>bacon</b> and <b>baconnaise</b>.</p>

6. Nhận xét của CSS bắt đầu với 
<!-- Strong importance -->
<p><strong>Caution:</strong> Falling rocks.</p>

<!-- Stylistically offset -->
<p>This recipe calls for <b>bacon</b> and <b>baconnaise</b>.</p>

7 và kết thúc với 
<!-- Strong importance -->
<p><strong>Caution:</strong> Falling rocks.</p>

<!-- Stylistically offset -->
<p>This recipe calls for <b>bacon</b> and <b>baconnaise</b>.</p>

8.
Sử dụng các yếu tố dựa trên văn bản
Nhiều hình thức truyền thông và nội dung khác nhau tồn tại trực tuyến; Tuy nhiên, văn bản là chủ yếu. Theo đó, có một số yếu tố khác nhau để hiển thị văn bản trên trang web. Hiện tại, chúng tôi sẽ tập trung vào các yếu tố phổ biến hơn, bao gồm các tiêu đề, đoạn văn, văn bản táo bạo để thể hiện tầm quan trọng và in nghiêng để nhấn mạnh. Sau đó, trong bài học 6, làm việc với kiểu chữ, chúng tôi sẽ xem xét kỹ hơn về cách tạo kiểu văn bản.
Tiêu đề
Các tiêu đề là các yếu tố cấp khối, và chúng có sáu bảng xếp hạng khác nhau, 
<!-- Strong importance -->
<p><strong>Caution:</strong> Falling rocks.</p>

<!-- Stylistically offset -->
<p>This recipe calls for <b>bacon</b> and <b>baconnaise</b>.</p>

9 đến 
1
2
3
4
5
6
7
8
9
<!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

1
2
3
4
5
6
0. Các tiêu đề giúp nhanh chóng phá vỡ nội dung và thiết lập hệ thống phân cấp và chúng là các định danh chính cho người dùng đọc một trang. Họ cũng giúp các công cụ tìm kiếm để lập chỉ mục và xác định nội dung trên một trang.
Các tiêu đề nên được sử dụng theo thứ tự có liên quan đến nội dung của một trang. Tiêu đề chính của một trang hoặc phần nên được đánh dấu bằng một phần tử 
<!-- Strong importance -->
<p><strong>Caution:</strong> Falling rocks.</p>

<!-- Stylistically offset -->
<p>This recipe calls for <b>bacon</b> and <b>baconnaise</b>.</p>

9 và các tiêu đề tiếp theo nên sử dụng 
<!-- Strong importance -->
<p><strong>Caution:</strong> Falling rocks.</p>

<!-- Stylistically offset -->
<p>This recipe calls for <b>bacon</b> and <b>baconnaise</b>.</p>

9, 
1
2
3
4
5
6
3, 
1
2
3
4
5
6
4, 
1
2
3
4
5
6
5 và 
1
2
3
4
5
6
0 Các yếu tố khi cần thiết.
Mỗi cấp độ tiêu đề nên được sử dụng ở nơi có giá trị về mặt ngữ nghĩa và không nên được sử dụng để làm cho văn bản táo bạo hoặc lớn có những cách khác, tốt hơn để làm điều đó.
Dưới đây là một ví dụ về HTML cho tất cả các cấp độ tiêu đề khác nhau và hiển thị kết quả trên một trang web.
Đoạn văn
Các tiêu đề thường được theo sau bởi các đoạn văn hỗ trợ. Các đoạn được xác định bằng phần tử cấp khối 
<p>Steve Jobs was a co-founder and longtime chief executive officer at Apple. On June 12, 2005, Steve gave the commencement address at Stanford University.</p>

<p>In his address Steve urged graduates to follow their dreams and, despite any setbacks, to never give up&ndash;advice which he sincerely took to heart.</p>

4. Các đoạn văn có thể xuất hiện lần lượt, thêm thông tin vào một trang như mong muốn. Dưới đây là một ví dụ về cách thiết lập các đoạn văn.
1
2
3
4
5
6
7
<h2>Heading Level 1</h2>
<h2>Heading Level 2</h2>
<h3>Heading Level 3</h3>
<h4>Heading Level 4</h4>
<h5>Heading Level 5</h5>
<h6>Heading Level 6</h6>

Văn bản táo bạo với mạnh mẽ
Để làm cho văn bản táo bạo và đặt tầm quan trọng mạnh mẽ vào nó, chúng tôi sẽ sử dụng phần tử cấp nội tuyến 
1
2
3
4
<p>Steve Jobs was a co-founder and longtime chief executive officer at Apple. On June 12, 2005, Steve gave the commencement address at Stanford University.</p>

<p>In his address Steve urged graduates to follow their dreams and, despite any setbacks, to never give up&ndash;advice which he sincerely took to heart.</p>

1
2
3
4
5
6
8. Có hai yếu tố sẽ in đậm văn bản cho chúng tôi: các yếu tố 
1
2
3
4
5
6
8 và 
<!-- Stressed emphasis -->
<p>I <em>love</em> Chicago!</p>

<!-- Alternative voice or tone -->
<p>The name <i>Shay</i> means a gift.</p>

0. Điều quan trọng là phải hiểu sự khác biệt ngữ nghĩa giữa hai.
Yếu tố 
1
2
3
4
5
6
8 được sử dụng về mặt ngữ nghĩa để tạo tầm quan trọng mạnh mẽ cho văn bản và do đó là lựa chọn phổ biến nhất cho văn bản in đậm. Mặt khác, yếu tố 
<!-- Stressed emphasis -->
<p>I <em>love</em> Chicago!</p>

<!-- Alternative voice or tone -->
<p>The name <i>Shay</i> means a gift.</p>

0 có nghĩa là về mặt ngữ nghĩa đối với văn bản bù đắp về mặt phong cách, đó là sự lựa chọn tốt nhất cho văn bản xứng đáng được chú ý. Chúng ta phải đánh giá tầm quan trọng của văn bản chúng ta muốn đặt là in đậm và chọn một yếu tố phù hợp.
Dưới đây là hai tùy chọn HTML để tạo văn bản táo bạo trong hành động:
In nghiêng văn bản với sự nhấn mạnh
Để in nghiêng văn bản, do đó đặt trọng tâm vào nó, chúng tôi sẽ sử dụng yếu tố cấp độ nội tuyến 
<!-- Stressed emphasis -->
<p>I <em>love</em> Chicago!</p>

<!-- Alternative voice or tone -->
<p>The name <i>Shay</i> means a gift.</p>

3. Như với các yếu tố cho văn bản táo bạo, có hai yếu tố khác nhau sẽ in nghiêng văn bản, mỗi yếu tố có ý nghĩa ngữ nghĩa hơi khác nhau.
Yếu tố 
<!-- Stressed emphasis -->
<p>I <em>love</em> Chicago!</p>

<!-- Alternative voice or tone -->
<p>The name <i>Shay</i> means a gift.</p>

3 được sử dụng về mặt ngữ nghĩa để nhấn mạnh vào văn bản; Do đó, nó là lựa chọn phổ biến nhất cho văn bản in nghiêng. Tùy chọn khác, phần tử 
<!-- Stressed emphasis -->
<p>I <em>love</em> Chicago!</p>

<!-- Alternative voice or tone -->
<p>The name <i>Shay</i> means a gift.</p>

5, được sử dụng về mặt ngữ nghĩa để truyền tải văn bản bằng một giọng nói hoặc giai điệu thay thế, gần như là nó được đặt trong các dấu ngoặc kép. Một lần nữa, chúng ta sẽ cần đánh giá tầm quan trọng của văn bản chúng ta muốn in nghiêng và chọn một yếu tố phù hợp.
Tại đây, mã HTML để in nghiêng:
1
2
3
4
5
6
<!-- Strong importance -->
<p><strong>Caution:</strong> Falling rocks.</p>

<!-- Stylistically offset -->
<p>This recipe calls for <b>bacon</b> and <b>baconnaise</b>.</p>

In nghiêng văn bản với sự nhấn mạnh
Để in nghiêng văn bản, do đó đặt trọng tâm vào nó, chúng tôi sẽ sử dụng yếu tố cấp độ nội tuyến <!-- Stressed emphasis -->
<p>I <em>love</em> Chicago!</p>

<!-- Alternative voice or tone -->
<p>The name <i>Shay</i> means a gift.</p>
3. Như với các yếu tố cho văn bản táo bạo, có hai yếu tố khác nhau sẽ in nghiêng văn bản, mỗi yếu tố có ý nghĩa ngữ nghĩa hơi khác nhau.
Yếu tố 
<!-- Stressed emphasis -->
<p>I <em>love</em> Chicago!</p>

<!-- Alternative voice or tone -->
<p>The name <i>Shay</i> means a gift.</p>

3 được sử dụng về mặt ngữ nghĩa để nhấn mạnh vào văn bản; Do đó, nó là lựa chọn phổ biến nhất cho văn bản in nghiêng. Tùy chọn khác, phần tử 
<!-- Stressed emphasis -->
<p>I <em>love</em> Chicago!</p>

<!-- Alternative voice or tone -->
<p>The name <i>Shay</i> means a gift.</p>

5, được sử dụng về mặt ngữ nghĩa để truyền tải văn bản bằng một giọng nói hoặc giai điệu thay thế, gần như là nó được đặt trong các dấu ngoặc kép. Một lần nữa, chúng ta sẽ cần đánh giá tầm quan trọng của văn bản chúng ta muốn in nghiêng và chọn một yếu tố phù hợp.
Tại đây, mã HTML để in nghiêng:
<!-- Stressed emphasis -->
<p>I <em>love</em> Chicago!</p>

<!-- Alternative voice or tone -->
<p>The name <i>Shay</i> means a gift.</p>

 
Hướng dẫn line break css codepen - ngắt dòng css codepen
 Những yếu tố cấp văn bản này khá tiện dụng để đưa nội dung của chúng tôi vào cuộc sống. Ngoài ra, còn có các yếu tố dựa trên cấu trúc. Trong khi các yếu tố dựa trên văn bản xác định các tiêu đề và đoạn văn, các yếu tố cấu trúc xác định các nhóm nội dung như tiêu đề, bài viết, chân trang, v.v. Hãy để một cái nhìn.
Cấu trúc xây dựng
Trong thời gian dài nhất, cấu trúc của một trang web được xây dựng bằng các bộ phận. Vấn đề là các bộ phận không cung cấp giá trị ngữ nghĩa, và khá khó để xác định ý định của các bộ phận này. May mắn là HTML5 đã giới thiệu các yếu tố dựa trên cấu trúc mới, bao gồm <!-- Stressed emphasis -->
<p>I <em>love</em> Chicago!</p>

<!-- Alternative voice or tone -->
<p>The name <i>Shay</i> means a gift.</p>
6, <!-- Stressed emphasis -->
<p>I <em>love</em> Chicago!</p>

<!-- Alternative voice or tone -->
<p>The name <i>Shay</i> means a gift.</p>
7, <!-- Stressed emphasis -->
<p>I <em>love</em> Chicago!</p>

<!-- Alternative voice or tone -->
<p>The name <i>Shay</i> means a gift.</p>
8, <!-- Stressed emphasis -->
<p>I <em>love</em> Chicago!</p>

<!-- Alternative voice or tone -->
<p>The name <i>Shay</i> means a gift.</p>
9, <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>
00 và <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>
01.
Tất cả các yếu tố mới này nhằm mục đích mang lại ý nghĩa cho việc tổ chức các trang của chúng tôi và cải thiện ngữ nghĩa cấu trúc của chúng tôi. Chúng đều là các yếu tố cấp khối và không có bất kỳ vị trí hoặc phong cách ngụ ý nào. Ngoài ra, tất cả các yếu tố này có thể được sử dụng nhiều lần trên mỗi trang, miễn là mỗi lần sử dụng phản ánh ý nghĩa ngữ nghĩa phù hợp.
<!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

0
<!-- Stressed emphasis -->
<p>I <em>love</em> Chicago!</p>

<!-- Alternative voice or tone -->
<p>The name <i>Shay</i> means a gift.</p>

6 so với 
<!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

05 so với 
<!-- Strong importance -->
<p><strong>Caution:</strong> Falling rocks.</p>

<!-- Stylistically offset -->
<p>This recipe calls for <b>bacon</b> and <b>baconnaise</b>.</p>

9 đến 
1
2
3
4
5
6
<!-- Strong importance -->
<p><strong>Caution:</strong> Falling rocks.</p>

<!-- Stylistically offset -->
<p>This recipe calls for <b>bacon</b> and <b>baconnaise</b>.</p>

<!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

1
1
2
3
4
5
6
0 Các yếu tố
Thật dễ dàng để nhầm lẫn phần tử 
<!-- Stressed emphasis -->
<p>I <em>love</em> Chicago!</p>

<!-- Alternative voice or tone -->
<p>The name <i>Shay</i> means a gift.</p>

6 với phần tử 
<!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

05 hoặc các phần tử tiêu đề, 
<!-- Strong importance -->
<p><strong>Caution:</strong> Falling rocks.</p>

<!-- Stylistically offset -->
<p>This recipe calls for <b>bacon</b> and <b>baconnaise</b>.</p>

9 đến 
1
2
3
4
5
6
0. Tất cả đều có ý nghĩa ngữ nghĩa khác nhau và nên được sử dụng theo nghĩa của chúng. Để tham khảo…
Phần tử 
<!-- Stressed emphasis -->
<p>I <em>love</em> Chicago!</p>

<!-- Alternative voice or tone -->
<p>The name <i>Shay</i> means a gift.</p>

6 là một yếu tố cấu trúc phác thảo tiêu đề của một phân đoạn của một trang. Nó nằm trong phần tử 
<!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

13.
Phần tử 
<!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

05 không được hiển thị trên một trang và được sử dụng để phác thảo siêu dữ liệu, bao gồm tiêu đề tài liệu và liên kết đến các tệp bên ngoài. Nó nằm trực tiếp trong phần tử 
<!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

15.
Các yếu tố tiêu đề, 
<!-- Strong importance -->
<p><strong>Caution:</strong> Falling rocks.</p>

<!-- Stylistically offset -->
<p>This recipe calls for <b>bacon</b> and <b>baconnaise</b>.</p>

9 đến 
Bài báo
Yếu tố 
<!-- Stressed emphasis -->
<p>I <em>love</em> Chicago!</p>

<!-- Alternative voice or tone -->
<p>The name <i>Shay</i> means a gift.</p>

8 được sử dụng để xác định một phần của nội dung độc lập, khép kín có thể được phân phối hoặc tái sử dụng độc lập. Chúng tôi thường sử dụng yếu tố 
<!-- Stressed emphasis -->
<p>I <em>love</em> Chicago!</p>

<!-- Alternative voice or tone -->
<p>The name <i>Shay</i> means a gift.</p>

8 để đánh dấu các bài đăng trên blog, bài báo, nội dung do người dùng gửi và tương tự.
Khi quyết định có sử dụng phần tử 
<!-- Stressed emphasis -->
<p>I <em>love</em> Chicago!</p>

<!-- Alternative voice or tone -->
<p>The name <i>Shay</i> means a gift.</p>

8 hay không, chúng ta phải xác định xem nội dung trong phần tử có thể được sao chép ở nơi khác mà không có bất kỳ sự nhầm lẫn nào không. Nếu nội dung trong phần tử 
<!-- Stressed emphasis -->
<p>I <em>love</em> Chicago!</p>

<!-- Alternative voice or tone -->
<p>The name <i>Shay</i> means a gift.</p>

8 đã bị xóa khỏi bối cảnh của trang và được đặt, ví dụ, trong một email hoặc công việc được in, nội dung đó vẫn có ý nghĩa.
<!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

0
Tiết diện
Phần tử 
<!-- Stressed emphasis -->
<p>I <em>love</em> Chicago!</p>

<!-- Alternative voice or tone -->
<p>The name <i>Shay</i> means a gift.</p>

9 được sử dụng để xác định nhóm nội dung theo chủ đề, nhưng không phải lúc nào cũng bao gồm một tiêu đề. Việc nhóm nội dung trong phần tử 
<!-- Stressed emphasis -->
<p>I <em>love</em> Chicago!</p>

<!-- Alternative voice or tone -->
<p>The name <i>Shay</i> means a gift.</p>

9 có thể là chung về bản chất, nhưng nó rất hữu ích để xác định tất cả các nội dung có liên quan.
Phần tử 
<!-- Stressed emphasis -->
<p>I <em>love</em> Chicago!</p>

<!-- Alternative voice or tone -->
<p>The name <i>Shay</i> means a gift.</p>

9 thường được sử dụng để chia nhỏ và cung cấp phân cấp cho một trang.
<!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

0
Quyết định giữa các yếu tố 
<!-- Stressed emphasis -->
<p>I <em>love</em> Chicago!</p>

<!-- Alternative voice or tone -->
<p>The name <i>Shay</i> means a gift.</p>

8, 
<!-- Stressed emphasis -->
<p>I <em>love</em> Chicago!</p>

<!-- Alternative voice or tone -->
<p>The name <i>Shay</i> means a gift.</p>

9 hoặc 
<p>Steve Jobs was a co-founder and longtime chief executive officer at Apple. On June 12, 2005, Steve gave the commencement address at Stanford University.</p>

<p>In his address Steve urged graduates to follow their dreams and, despite any setbacks, to never give up&ndash;advice which he sincerely took to heart.</p>

0
Đôi khi, việc quyết định yếu tố nào là yếu tố nào. Bí quyết ở đây, như với mọi quyết định ngữ nghĩa, là xem xét nội dung.
Cả hai phần tử 
<!-- Stressed emphasis -->
<p>I <em>love</em> Chicago!</p>

<!-- Alternative voice or tone -->
<p>The name <i>Shay</i> means a gift.</p>

8 và 
<!-- Stressed emphasis -->
<p>I <em>love</em> Chicago!</p>

<!-- Alternative voice or tone -->
<p>The name <i>Shay</i> means a gift.</p>

9 đều góp phần vào cấu trúc tài liệu và giúp phác thảo một tài liệu. Nếu nội dung chỉ được nhóm lại cho mục đích tạo kiểu và không cung cấp giá trị cho phác thảo của một tài liệu, hãy sử dụng phần tử 
<p>Steve Jobs was a co-founder and longtime chief executive officer at Apple. On June 12, 2005, Steve gave the commencement address at Stanford University.</p>

<p>In his address Steve urged graduates to follow their dreams and, despite any setbacks, to never give up&ndash;advice which he sincerely took to heart.</p>

0.
Nếu nội dung thêm vào phác thảo tài liệu và nó có thể được phân phối lại hoặc cung cấp độc lập, hãy sử dụng phần tử 
<!-- Stressed emphasis -->
<p>I <em>love</em> Chicago!</p>

<!-- Alternative voice or tone -->
<p>The name <i>Shay</i> means a gift.</p>

8.
Nếu nội dung thêm vào phác thảo tài liệu và đại diện cho một nhóm nội dung theo chủ đề, hãy sử dụng phần tử 
<!-- Stressed emphasis -->
<p>I <em>love</em> Chicago!</p>

<!-- Alternative voice or tone -->
<p>The name <i>Shay</i> means a gift.</p>

9.
Qua một bên
Phần tử 
<!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

00 giữ nội dung, chẳng hạn như các thanh bên, chèn hoặc giải thích ngắn gọn, có liên quan hữu hình với nội dung xung quanh nó. Ví dụ, khi được sử dụng trong phần tử 
<!-- Stressed emphasis -->
<p>I <em>love</em> Chicago!</p>

<!-- Alternative voice or tone -->
<p>The name <i>Shay</i> means a gift.</p>

8, phần tử 
<!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

00 có thể xác định nội dung liên quan đến tác giả của bài viết.
Chúng tôi có thể theo bản năng nghĩ về một yếu tố 
<!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

00 như một yếu tố xuất hiện ở bên trái hoặc bên phải của một trang. Tuy nhiên, chúng ta phải nhớ rằng tất cả các phần tử cấu trúc, bao gồm cả phần tử 
<!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

00, là các phần tử cấp khối và như vậy sẽ xuất hiện trên một dòng mới, chiếm toàn bộ chiều rộng có sẵn của trang hoặc của phần tử mà chúng được lồng trong , còn được gọi là yếu tố cha mẹ của họ.
<!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

0
Chúng tôi sẽ thảo luận về cách thay đổi vị trí của một yếu tố, có thể đặt nó sang phải hoặc bên trái của một nhóm nội dung, trong Bài 5, nội dung định vị của Hồi giáo.
Chân trang
Phần tử 
<!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

01 xác định việc đóng hoặc kết thúc của một trang, bài viết, phần hoặc phân đoạn khác của một trang. Nói chung, phần tử 
<!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

01 được tìm thấy ở dưới cùng của cha mẹ của nó. Nội dung trong phần tử 
<!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

01 phải là thông tin tương đối và không nên chuyển hướng khỏi tài liệu hoặc phần mà nó được bao gồm trong.
<!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

0
1
2
3
4
5
6
0, được sử dụng để chỉ định nhiều cấp độ tiêu đề văn bản trong suốt một trang.
dẫn đường
Phần tử 
<!-- Stressed emphasis -->
<p>I <em>love</em> Chicago!</p>

<!-- Alternative voice or tone -->
<p>The name <i>Shay</i> means a gift.</p>

7 xác định một phần của các liên kết điều hướng chính trên một trang. Phần tử 
<!-- Stressed emphasis -->
<p>I <em>love</em> Chicago!</p>

<!-- Alternative voice or tone -->
<p>The name <i>Shay</i> means a gift.</p>

7 chỉ được dành riêng cho các phần điều hướng chính, chẳng hạn như điều hướng toàn cầu, bảng nội dung, liên kết trước/tiếp theo hoặc các nhóm liên kết điều hướng đáng chú ý khác.
Thông thường nhất, các liên kết được bao gồm trong phần tử 
<!-- Stressed emphasis -->
<p>I <em>love</em> Chicago!</p>

<!-- Alternative voice or tone -->
<p>The name <i>Shay</i> means a gift.</p>

7 sẽ liên kết đến các trang khác trong cùng một trang web hoặc với các phần của cùng một trang web. Các liên kết một lần khác không nên được bọc trong phần tử 
<!-- Stressed emphasis -->
<p>I <em>love</em> Chicago!</p>

<!-- Alternative voice or tone -->
<p>The name <i>Shay</i> means a gift.</p>

7; Họ nên sử dụng phần tử neo, 
<!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

22 và phần tử neo.
<!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

0
<!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

3
<!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

5
<!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

7
<!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

9
Với các yếu tố cấu trúc và các yếu tố dựa trên văn bản dưới vành đai của chúng tôi, kiến ​​thức HTML của chúng tôi thực sự bắt đầu kết hợp với nhau. Bây giờ là thời điểm tốt để xem lại trang web Hội nghị Styles của chúng tôi và xem liệu chúng tôi có thể cung cấp cho nó một cấu trúc tốt hơn một chút không.
Trong thực tế
Hiện tại, trang web Hội nghị Styles của chúng tôi thiếu cấu trúc thực sự và nội dung cho vấn đề đó. Hãy để một chút thời gian để đưa trang chủ của chúng tôi một chút.
  1. Sử dụng tệp index.html hiện tại của chúng tôi, hãy để thêm vào phần tử 
    <!-- Stressed emphasis -->
<p>I <em>love</em> Chicago!</p>

<!-- Alternative voice or tone -->
<p>The name <i>Shay</i> means a gift.</p>

    6. Phần tử 
    <!-- Stressed emphasis -->
<p>I <em>love</em> Chicago!</p>

<!-- Alternative voice or tone -->
<p>The name <i>Shay</i> means a gift.</p>

    6 của chúng tôi nên bao gồm phần tử 
    <!-- Strong importance -->
<p><strong>Caution:</strong> Falling rocks.</p>

<!-- Stylistically offset -->
<p>This recipe calls for <b>bacon</b> and <b>baconnaise</b>.</p>

    9 hiện tại của chúng tôi; Hãy để thêm một phần tử 
1
2
3
4
5
6
7
1
1
2
3
4
5
6
3 làm khẩu hiệu để hỗ trợ phần tử 
<!-- Strong importance -->
<p><strong>Caution:</strong> Falling rocks.</p>

<!-- Stylistically offset -->
<p>This recipe calls for <b>bacon</b> and <b>baconnaise</b>.</p>

9 của chúng tôi.
1
2
3
4
5
6
7
2
  • Sau phần tử 
    <!-- Stressed emphasis -->
<p>I <em>love</em> Chicago!</p>

<!-- Alternative voice or tone -->
<p>The name <i>Shay</i> means a gift.</p>

    6 của chúng tôi, hãy để thêm một nhóm nội dung mới, sử dụng yếu tố 
    <!-- Stressed emphasis -->
<p>I <em>love</em> Chicago!</p>

<!-- Alternative voice or tone -->
<p>The name <i>Shay</i> means a gift.</p>

    9, giới thiệu hội nghị của chúng tôi. Chúng tôi sẽ bắt đầu phần này với một yếu tố 
    <!-- Strong importance -->
<p><strong>Caution:</strong> Falling rocks.</p>

<!-- Stylistically offset -->
<p>This recipe calls for <b>bacon</b> and <b>baconnaise</b>.</p>

    9 mới và kết thúc nó bằng đoạn văn hiện có của chúng tôi.
    • 1
2
3
4
5
6
7
    3
    1
2
3
4
5
6
7
    2
  • Sau phần tử 
    <!-- Stressed emphasis -->
<p>I <em>love</em> Chicago!</p>

<!-- Alternative voice or tone -->
<p>The name <i>Shay</i> means a gift.</p>

    6 của chúng tôi, hãy để thêm một nhóm nội dung mới, sử dụng yếu tố 
    <!-- Stressed emphasis -->
<p>I <em>love</em> Chicago!</p>

<!-- Alternative voice or tone -->
<p>The name <i>Shay</i> means a gift.</p>

    9, giới thiệu hội nghị của chúng tôi. Chúng tôi sẽ bắt đầu phần này với một yếu tố 
    <!-- Strong importance -->
<p><strong>Caution:</strong> Falling rocks.</p>

<!-- Stylistically offset -->
<p>This recipe calls for <b>bacon</b> and <b>baconnaise</b>.</p>

    9 mới và kết thúc nó bằng đoạn văn hiện có của chúng tôi.
    • 1
2
3
4
5
6
7
    3
    • 1
2
3
4
5
6
7
    5
    Sau khi giới thiệu về hội nghị của chúng tôi, hãy để thêm một nhóm nội dung khác trêu chọc một vài trang mà chúng tôi sẽ thêm, cụ thể là người nói, lịch trình và trang địa điểm. Mỗi trang chúng tôi trêu chọc cũng nên nằm trong phần riêng của nó và bao gồm văn bản hỗ trợ.    		Chúng tôi sẽ nhóm tất cả các lời trêu ghẹo bên trong một yếu tố 
    <!-- Stressed emphasis -->
<p>I <em>love</em> Chicago!</p>

<!-- Alternative voice or tone -->
<p>The name <i>Shay</i> means a gift.</p>

    9 và mỗi lời trêu ghẹo riêng lẻ cũng sẽ được bọc trong một yếu tố 
    <!-- Stressed emphasis -->
<p>I <em>love</em> Chicago!</p>

<!-- Alternative voice or tone -->
<p>The name <i>Shay</i> means a gift.</p>

    9. Trong tất cả, chúng tôi sẽ có ba phần tử 
    <!-- Stressed emphasis -->
<p>I <em>love</em> Chicago!</p>

<!-- Alternative voice or tone -->
<p>The name <i>Shay</i> means a gift.</p>

    9 bên trong một yếu tố 
    <!-- Stressed emphasis -->
<p>I <em>love</em> Chicago!</p>

<!-- Alternative voice or tone -->
<p>The name <i>Shay</i> means a gift.</p>

    9 khác, điều này đều ổn.
    1
2
3
4
5
6
7
    6
    1
2
3
4
5
6
7
    7
    Cuối cùng, hãy để thêm bản quyền của chúng tôi trong phần tử 
    <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

    01 ở cuối trang của chúng tôi. Để làm như vậy, hãy để sử dụng phần tử 
    <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

    62, thể hiện ngữ nghĩa về mặt ngữ nghĩa và các ý kiến ​​nhỏ và bản in nhỏ cho bản quyền của chúng tôi.    		Nói chung, nội dung trong phần tử 
    <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

    62 sẽ được hiển thị là, tốt, nhỏ, nhưng thiết lập lại CSS của chúng tôi sẽ ngăn chặn điều đó xảy ra.
    1
2
3
4
     
    Hướng dẫn line break css codepen - ngắt dòng css codepen
     
    1
2
3
4
5
6
7
    9
    Bây giờ chúng ta có thể thấy trang chủ của chúng ta bắt đầu trở nên sống động.
    Hình 2
    Trang chủ của chúng tôi sau khi thêm nhiều nội dung và cấu trúc
    Mã hóa các ký tự đặc biệt
    Phần tử 
    <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

    0
    <h2>Heading Level 1</h2>
<h2>Heading Level 2</h2>
<h3>Heading Level 3</h3>
<h4>Heading Level 4</h4>
<h5>Heading Level 5</h5>
<h6>Heading Level 6</h6>

    1
    Bao bọc các yếu tố cấp khối với neo
    Về bản chất, phần tử neo, 
    <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

    22, là một yếu tố nội tuyến và theo các tiêu chuẩn web, các phần tử cấp nội tuyến có thể không bao gồm các phần tử cấp khối. Tuy nhiên, với sự ra đời của HTML5, các phần tử neo đặc biệt có quyền kết thúc một trong hai phần tử cấp độ khối, nội tuyến hoặc bất kỳ cấp nào khác. Đây là một sự phá vỡ từ quy ước tiêu chuẩn, nhưng nó có thể cho phép để cho phép toàn bộ các khối nội dung trên một trang trở thành liên kết.
    Đường dẫn tương đối & tuyệt đối
    Nếu trang được liên kết để cư trú trong một thư mục hoặc thư mục khác, giá trị thuộc tính 
    <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

    72 cũng cần phải phản ánh điều này. Nói trang 
    <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

    80 nằm trong thư mục 
    <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

    83; Con đường tương đối sau đó sẽ là 
    <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

    84.
    Liên kết với các trang web khác bên ngoài một trang hiện tại yêu cầu một đường dẫn tuyệt đối, trong đó giá trị thuộc tính 
    <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

    72 phải bao gồm toàn bộ miền. Một liên kết đến Google sẽ cần giá trị thuộc tính 
    <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

    72 của 
    <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

    87, bắt đầu bằng HTTP và bao gồm miền, 
    <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

    88 trong trường hợp này.
    Ở đây, nhấp vào văn bản trên mạng Giới thiệu sẽ mở trang 
    <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

    80 bên trong trình duyệt của chúng tôi. Nhấp vào văn bản Google Google, mặt khác, sẽ mở 
    <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

    90 trong trình duyệt của chúng tôi.
    1
2
3
4
5
6
    3 trong phần tử 
    <!-- Stressed emphasis -->
<p>I <em>love</em> Chicago!</p>

<!-- Alternative voice or tone -->
<p>The name <i>Shay</i> means a gift.</p>

    6 của chúng tôi, cũng như phần tử 
    <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

    62 trong phần tử 
    <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

    01 của chúng tôi, có một số điều thú vị đang diễn ra. Cụ thể, một vài ký tự đặc biệt trong các yếu tố này đang được mã hóa.
    Các nhân vật đặc biệt bao gồm các dấu chấm câu khác nhau, chữ cái có dấu và ký hiệu. Khi được gõ trực tiếp vào HTML, chúng có thể bị hiểu lầm hoặc nhầm lẫn với nhân vật sai; Do đó, chúng cần được mã hóa.
    Mỗi ký tự được mã hóa sẽ bắt đầu với một ampersand, 
    <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

    68 và kết thúc bằng dấu chấm phẩy, 
    <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

    69. Những gì rơi vào giữa ampersand và semicolon là một nhân vật mã hóa độc đáo, có thể là một tên mã hóa hoặc mã hóa số.
    Ví dụ: chúng tôi sẽ mã hóa từ Res Resumé trực tiếp là <!-- Division -->
<div class="social">
<p>I may be found on...</p>
<p>Additionally, I have a profile on...</p>
</div>
<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>
70. Trong tiêu đề của chúng tôi, chúng tôi đã mã hóa cả các dấu gạch ngang của EN và EM, và trong chân trang của chúng tôi, chúng tôi đã mã hóa ký hiệu bản quyền. Để tham khảo, một danh sách dài các mã hóa ký tự có thể được tìm thấy tại ký tự dán sao chép.
    Với trang chủ của chúng tôi hình thành, hãy để xem xét việc tạo các siêu liên kết để chúng tôi có thể thêm các trang bổ sung và xây dựng phần còn lại của trang web của chúng tôi.
    Tạo siêu liên kết
    Cùng với văn bản, một trong những thành phần cốt lõi của Internet là siêu liên kết, cung cấp khả năng liên kết từ một trang web hoặc tài nguyên khác. Các siêu liên kết được thiết lập bằng cách sử dụng neo, 
    <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

    22, phần tử cấp nội tuyến. Để tạo một liên kết từ một trang (hoặc tài nguyên) sang một liên kết khác, thuộc tính 
    <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

    72, được gọi là tham chiếu siêu liên kết, được yêu cầu. Giá trị thuộc tính 
    <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

    72 xác định đích của liên kết.    		Ví dụ: nhấp vào văn bản, Shay Shay, được bọc bên trong phần tử neo với giá trị thuộc tính 
    <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

    72 của 
    <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

    75, sẽ đưa người dùng đến trang web của tôi.
    Liên kết đến một địa chỉ email
    Thỉnh thoảng, chúng tôi có thể muốn tạo một siêu liên kết đến địa chỉ email của chúng tôi, ví dụ, văn bản siêu liên kết nói rằng Email Email cho tôi, khi nhấp vào Mở một ứng dụng email mặc định của người dùng và sử dụng trước một phần của email. Ở mức tối thiểu, địa chỉ email mà email đang được gửi là dân cư; Các thông tin khác như dòng chủ đề và văn bản cơ thể cũng có thể được bao gồm.
    Để tạo một liên kết email, giá trị thuộc tính 
    <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

    72 cần bắt đầu với 
    <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

    92 theo sau là địa chỉ email mà email nên được gửi. Ví dụ, để tạo một liên kết email đến 
    <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

    93, giá trị thuộc tính 
    <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

    72 sẽ là 
    <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

    95.
    Ngoài ra, chủ đề, văn bản cơ thể và thông tin khác cho email có thể được điền. Để thêm một dòng chủ đề, chúng tôi sẽ bao gồm tham số 
    <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

    96 sau địa chỉ email. Tham số đầu tiên theo địa chỉ email phải bắt đầu bằng dấu câu hỏi, 
    <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

    97, để liên kết nó với đường dẫn siêu liên kết. Nhiều từ trong một dòng chủ đề yêu cầu các không gian được mã hóa bằng 
    <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

    98.
    Thêm văn bản cơ thể hoạt động theo cách tương tự như thêm chủ đề, lần này sử dụng tham số 
    <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

    99 trong giá trị thuộc tính 
    <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

    72. Bởi vì chúng tôi đang ràng buộc một tham số với một tham số khác, chúng tôi cần sử dụng ampersand, 
    <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

    68, để tách hai tham số. Cũng như chủ thể, các không gian phải được mã hóa bằng cách sử dụng 
    <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

    98 và ngắt dòng phải được mã hóa bằng 
    1
2
3
4
5
6
    <h2>Heading Level 1</h2>
<h2>Heading Level 2</h2>
<h3>Heading Level 3</h3>
<h4>Heading Level 4</h4>
<h5>Heading Level 5</h5>
<h6>Heading Level 6</h6>

    3
    1
2
3
4
5
6
7
    03.
    Nhìn chung, một liên kết đến 
    <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

    93 với chủ đề của việc tiếp cận với văn bản và văn bản cơ thể của bạn Làm thế nào bạn, bạn sẽ yêu cầu một giá trị thuộc tính 
    <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

    72 của 
    Mở liên kết trong một cửa sổ mới
    Một tính năng có sẵn với các siêu liên kết là khả năng xác định nơi liên kết mở khi nhấp. Thông thường, các liên kết mở trong cùng một cửa sổ mà chúng được nhấp; Tuy nhiên, các liên kết cũng có thể được mở trong các cửa sổ mới.
    Để kích hoạt hành động mở một liên kết trong một cửa sổ mới, hãy sử dụng thuộc tính 
    1
2
3
4
5
6
7
    06.
    Ở đây, sự cố đầy đủ:
    <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

    0
    <h2>Heading Level 1</h2>
<h2>Heading Level 2</h2>
<h3>Heading Level 3</h3>
<h4>Heading Level 4</h4>
<h5>Heading Level 5</h5>
<h6>Heading Level 6</h6>

    5
    1
2
3
4
5
6
7
    07 với giá trị 
    1
2
3
4
5
6
7
    08. Thuộc tính 
    1
2
3
4
5
6
7
    07 xác định chính xác nơi liên kết sẽ được hiển thị và giá trị 
    1
2
3
4
5
6
7
    08 chỉ định một cửa sổ mới.
    Để mở 
    Mở liên kết trong một cửa sổ mới
    Một tính năng có sẵn với các siêu liên kết là khả năng xác định nơi liên kết mở khi nhấp. Thông thường, các liên kết mở trong cùng một cửa sổ mà chúng được nhấp; Tuy nhiên, các liên kết cũng có thể được mở trong các cửa sổ mới.
    Để kích hoạt hành động mở một liên kết trong một cửa sổ mới, hãy sử dụng thuộc tính 
    1
2
3
4
5
6
7
    11 trong một cửa sổ mới, mã sẽ trông như thế này:
    <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

    0
    <h2>Heading Level 1</h2>
<h2>Heading Level 2</h2>
<h3>Heading Level 3</h3>
<h4>Heading Level 4</h4>
<h5>Heading Level 5</h5>
<h6>Heading Level 6</h6>

    5
    1
2
3
4
5
6
7
    07 với giá trị 
    1
2
3
4
5
6
7
    08. Thuộc tính 
    1
2
3
4
5
6
7
    07 xác định chính xác nơi liên kết sẽ được hiển thị và giá trị 
    1
2
3
4
5
6
7
    08 chỉ định một cửa sổ mới.
    Để mở 
    1
2
3
4
5
6
7
    11 trong một cửa sổ mới, mã sẽ trông như thế này:
    <h2>Heading Level 1</h2>
<h2>Heading Level 2</h2>
<h3>Heading Level 3</h3>
<h4>Heading Level 4</h4>
<h5>Heading Level 5</h5>
<h6>Heading Level 6</h6>

    7
    Liên kết đến một địa chỉ email
    Thỉnh thoảng, chúng tôi có thể muốn tạo một siêu liên kết đến địa chỉ email của chúng tôi, ví dụ, văn bản siêu liên kết nói rằng Email Email cho tôi, khi nhấp vào Mở một ứng dụng email mặc định của người dùng và sử dụng trước một phần của email. Ở mức tối thiểu, địa chỉ email mà email đang được gửi là dân cư; Các thông tin khác như dòng chủ đề và văn bản cơ thể cũng có thể được bao gồm.
    Để tạo một liên kết email, giá trị thuộc tính 
    <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

    72 cần bắt đầu với 
    <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

    92 theo sau là địa chỉ email mà email nên được gửi. Ví dụ, để tạo một liên kết email đến 
    <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

    93, giá trị thuộc tính 
    <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

    72 sẽ là 
    <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

    95.
    1. Ngoài ra, chủ đề, văn bản cơ thể và thông tin khác cho email có thể được điền. Để thêm một dòng chủ đề, chúng tôi sẽ bao gồm tham số 
      <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

      96 sau địa chỉ email. Tham số đầu tiên theo địa chỉ email phải bắt đầu bằng dấu câu hỏi, 
      <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

      97, để liên kết nó với đường dẫn siêu liên kết. Nhiều từ trong một dòng chủ đề yêu cầu các không gian được mã hóa bằng 
      <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

      98.
      Thêm văn bản cơ thể hoạt động theo cách tương tự như thêm chủ đề, lần này sử dụng tham số 
      <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

      99 trong giá trị thuộc tính 
      <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

      72. Bởi vì chúng tôi đang ràng buộc một tham số với một tham số khác, chúng tôi cần sử dụng ampersand, 
      <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

      68, để tách hai tham số. Cũng như chủ thể, các không gian phải được mã hóa bằng cách sử dụng 
      <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

      98 và ngắt dòng phải được mã hóa bằng 
    1
2
3
4
5
6
    <h2>Heading Level 1</h2>
<h2>Heading Level 2</h2>
<h3>Heading Level 3</h3>
<h4>Heading Level 4</h4>
<h5>Heading Level 5</h5>
<h6>Heading Level 6</h6>

    3
    1
2
3
4
5
6
7
    03.
    1
2
3
4
  • Để điều hướng trên tất cả các trang khác nhau, chúng tôi sẽ thêm vào menu điều hướng, sử dụng phần tử 
    <!-- Stressed emphasis -->
<p>I <em>love</em> Chicago!</p>

<!-- Alternative voice or tone -->
<p>The name <i>Shay</i> means a gift.</p>

    7, trong phần tử 
    <!-- Stressed emphasis -->
<p>I <em>love</em> Chicago!</p>

<!-- Alternative voice or tone -->
<p>The name <i>Shay</i> means a gift.</p>

    6 của chúng tôi. Chúng tôi sẽ tạo ra các diễn giả, lịch trình, địa điểm và các trang đăng ký để đi với trang chủ của chúng tôi, vì vậy chúng tôi nên tạo liên kết cho tất cả chúng.
    • 1
2
3
4
    1
    1
2
3
4
    2
  • Hãy để thêm vào cùng một menu điều hướng từ phần tử 
    <!-- Stressed emphasis -->
<p>I <em>love</em> Chicago!</p>

<!-- Alternative voice or tone -->
<p>The name <i>Shay</i> means a gift.</p>

    6 của chúng tôi vào phần tử 
    <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

    01 của chúng tôi để thuận tiện.
    • 1
2
3
4
    3
    1
2
3
4
    2
  • Hãy để thêm vào cùng một menu điều hướng từ phần tử 
    <!-- Stressed emphasis -->
<p>I <em>love</em> Chicago!</p>

<!-- Alternative voice or tone -->
<p>The name <i>Shay</i> means a gift.</p>

    6 của chúng tôi vào phần tử 
    <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

    01 của chúng tôi để thuận tiện.
    • 1
2
3
4
    3
    • 1
2
3
4
    5    		Trong yếu tố 
    <!-- Stressed emphasis -->
<p>I <em>love</em> Chicago!</p>

<!-- Alternative voice or tone -->
<p>The name <i>Shay</i> means a gift.</p>

    9 giới thiệu hội nghị của chúng tôi, ngay dưới tiêu đề của chúng tôi, chúng tôi cũng nên bao gồm một liên kết để đăng ký hội nghị. Đặt một liên kết bên dưới đoạn văn sẽ hoạt động hoàn hảo.
    1
2
3
4
    6
    1
2
3
4
    7
    1
2
3
4
    2
  • Hãy để thêm vào cùng một menu điều hướng từ phần tử 
    <!-- Stressed emphasis -->
<p>I <em>love</em> Chicago!</p>

<!-- Alternative voice or tone -->
<p>The name <i>Shay</i> means a gift.</p>

    6 của chúng tôi vào phần tử 
    <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

    01 của chúng tôi để thuận tiện.
    • 1
2
3
4
    3
    1
2
3
4
    5
    Trong yếu tố 
    <!-- Stressed emphasis -->
<p>I <em>love</em> Chicago!</p>

<!-- Alternative voice or tone -->
<p>The name <i>Shay</i> means a gift.</p>

    9 giới thiệu hội nghị của chúng tôi, ngay dưới tiêu đề của chúng tôi, chúng tôi cũng nên bao gồm một liên kết để đăng ký hội nghị. Đặt một liên kết bên dưới đoạn văn sẽ hoạt động hoàn hảo.
     
    Hướng dẫn line break css codepen - ngắt dòng css codepen
     
    1
2
3
4
    6
    1
2
3
4
    7
    Chúng tôi có thể quên quên thêm các liên kết đến tất cả các phần trêu chọc các trang khác của chúng tôi. Bên trong mỗi phần, hãy để bọc cả hai phần tử 1
2
3
4
5
63 và 1
2
3
4
5
65 trong một phần tử neo liên kết với trang thích hợp.
    Chúng tôi muốn đảm bảo rằng chúng tôi làm điều này cho mỗi phần phù hợp.
    1
2
3
4
    9 or Download the Source Code (Zip
file)
    Bây giờ chúng ta cần tạo ra một số ít các trang mới. Hãy để tạo ra 1
2
3
4
5
6
731, 1
2
3
4
5
6
732, 1
2
3
4
5
6
733 và 1
2
3
4
5
6
734. Các tệp này sẽ sống trong cùng một thư mục với tệp 1
2
3
4
5
6
722 và vì chúng tôi giữ chúng bên trong cùng một thư mục, tất cả các liên kết của chúng tôi sẽ hoạt động như mong đợi.
    Để đảm bảo rằng tất cả các trang của chúng tôi trông giống nhau, hãy để đảm bảo rằng tất cả các tệp mới này có cùng cấu trúc tài liệu và các phần tử 
    <!-- Stressed emphasis -->
<p>I <em>love</em> Chicago!</p>

<!-- Alternative voice or tone -->
<p>The name <i>Shay</i> means a gift.</p>

    6 và 
    <!-- Division -->
<div class="social">
  <p>I may be found on...</p>
  <p>Additionally, I have a profile on...</p>
</div>

<!-- Span -->
<p>Soon we'll be <span class="tooltip">writing HTML</span> with the best of them.</p>

    01 dưới dạng tệp 
    1
2
3
4
5
6
7
    22.
    Nó chính thức, chúng tôi không còn làm việc với một trang duy nhất mà thực sự là một trang web đầy đủ.
    • Hình 2
    • Trang chủ của chúng tôi sau tất cả các liên kết và điều hướng khác nhau đã được thêm
    • Demo & Nguồn mã
    • Dưới đây bạn có thể xem trang web Hội nghị Styles ở trạng thái hiện tại, cũng như tải xuống mã nguồn cho trang web ở trạng thái hiện tại.
    •  Xem trang web Hội nghị Styles hoặc tải xuống mã nguồn (tệp zip)
    Bản tóm tắt
    Ngữ ký, như được thảo luận trong bài học này, là rất cần thiết để cung cấp cho HTML của chúng tôi cấu trúc và ý nghĩa. Tiến về phía trước, chúng tôi định kỳ giới thiệu các yếu tố mới, tất cả đều đi kèm với ý nghĩa ngữ nghĩa của riêng họ. Đó là ý nghĩa của tất cả các yếu tố này sẽ cung cấp cho nội dung của chúng tôi nhiều giá trị nhất.