資料結構
網路
關係型資料庫管理系統 (RDBMS)
作業系統
Java
MS Excel
iOS
HTML
CSS
Android
Python
C語言程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP
物理學
化學
生物學
數學
英語
經濟學
心理學
社會學
服裝學
法學如何在HTML5中顯示文件的主體內容？
為了顯示文件中的主要內容，我們使用<main>標籤。<main>標籤包含開始和結束標籤，其間的內容對於文件是唯一的，它不包含在多個文件中重複的內容，例如導航連結、網站徽標、側邊欄和搜尋表單。
在一個文件中，應該只有一個<main>元素。<main>元素不能是<aside>、<footer>、<article>或<nav>元素的子元素。
<main>標籤幾乎所有瀏覽器都支援，也支援全域性和事件屬性。
語法
以下是HTML中<main>標籤的用法：
<main> …….. </main>
示例
以下示例演示如何顯示文件的主要內容。
<!DOCTYPE html>
<html>
<body>
<main>
<h1>Learning</h1>
<p>Learn to gain experience and try to share your knowledge with others.</p>
<article>
<h3>Web Development Tutorials</h3>
<p>Consist of CSS, HTML, and PHP tutorials for 2nd Semester exams.</p>
</article>
<article>
<h3>Academic Tutorials</h3>
<p>Consist of Computer Fundamental, Computer Network tutorials for 1st Semester exams.</p>
</article>
</main>
</body>
</html>
HTML5中的<article>標籤
在上面的示例中，我們使用了<article>標籤，它位於<main>標籤的開始和結束標籤之間。<article>標籤用於表示一篇文章；它是HTML5中新的分節元素。
<article>標籤中的內容與網站的其他內容相比是獨立的，或者它表示頁面、網站或文件中包含自包含構成的頁面元件。
示例
以下示例解釋了HTML5中<article>標籤的用法：
<!DOCTYPE html>
<html>
<head>
<title> Display the main content of a document using HTML5 </title>
</head>
<body>
<h2>TutorialsPoint</h2>
<article style="width: 300px; border: 2px solid gray; padding: 10px; border-radius: 10px; margin: 5px;">
<img src="https://tutorialspoint.tw/images/logo.png?v2" alt="tutorials" width="300" height="50" class="alignnone size-medium wp-image-560930" />
<h1>TutorialsPoint</h1>
<p>Tutorials Point is a leading Ed Tech company striving to provide the best learning material on technical and non-technical subjects.</p>
</article>
</body>
</html>
示例
讓我們看看另一個使用<main>和<article>標籤顯示文件主要內容的示例：
<!DOCTYPE html>
<html>
<head>
<style>
main {
margin: 0;
padding: 5px;
background-color: lightgreen;
}
main>h1,
p,
.browser {
margin: 10px;
padding: 5px;
}
.web {
background: white;
}
.web>h2,
p {
margin: 4px;
font-size: 90%;
}
</style>
</head>
<body>
<h1>Displaying main content in document by applying CSS</h1>
<main>
<h1>Popular Web Development Languages</h1>
<p>HTML, JavaScript, and Angular are the most used Web Development Language</p>
<article class="web">
<h2>HTML</h2>
<p>HTML stands for Hyper Text Markup Language, which is the most widely used language on Web to develop web pages. HTML was created by Berners-Lee in late 1991 but "HTML 2.0" was the first standard HTML specification which was published in 1995. </p>
</article>
<article class="web">
<h2>JavaScript</h2>
<p>JavaScript is a lightweight, interpreted programming language. It is designed for creating network-centric applications. It is complimentary to and integrated with Java. JavaScript is very easy to implement because it is integrated with HTML. It is open and cross-platform.</p>
</article>
<article class="web">
<h2>Angular</h2>
<p>Angular 8 is an open source, TypeScript based frontend web application framework. Angular 8 has been released by Google’s Angular community.</p>
</article>
</main>
</body>
</html>
更新於：2023年10月10日
205 次瀏覽
廣告