HTML5 <footer>標記用法及代碼示例

HTML中的<footer>標記用於定義HTML文檔的頁腳。此部分包含頁腳信息(作者信息，版權信息，載體等)。頁腳標簽在body標簽內使用。 <footer>標簽是HTML5中的新標簽。頁腳元素需要一個開始標簽和一個結束標簽。

用法:

<footer> ... </footer>

頁腳元素通常包含作者信息，版權信息，聯係信息，站點Map，返回頁首鏈接，相關文檔等。

以下示例說明了HTML元素中的<footer>標簽：

例：

<!DOCTYPE html> 
<html> 
    <head> 
        <title>HTML footer Tag</title> 
        <style> 
            a { 
                font-size:25px; 
                text-decoration:none; 
            } 
            p { 
                font-size:25px; 
            } 
        </style> 
    </head> 
    <body> 
        <footer> 
            <nav> 
                <p> 
                    <a href= 
"https://www.geeksforgeeks.org/about/">About Us</a>|  
                    <a href= 
"https://www.geeksforgeeks.org/privacy-policy/">Privacy Policy</a>|  
                    <a href= 
"https://www.geeksforgeeks.org/careers/">Careers</a>  
                </p> 
            </nav> 
            <p>@geeksforgeeks, Some rights reserved</p> 
        </footer> 
    </body> 
</html>

輸出：

範例2：

<!DOCTYPE html> 
<html> 
    <head> 
        <title>footer tag</title> 
        <style> 
            .column { 
                float:left; 
                width:27%; 
               height:300px;  
            } 
            p { 
                font-size:20px; 
                font-weight:bold; 
            } 
        </style> 
    </head> 
    <body> 
        <footer> 
            <div class="column"> 
                <p>Company</p> 
                <ul style="list-style-type:disc"> 
                    <li>About Us</li> 
                    <li>Careers</li> 
                    <li>Privacy Policy</li> 
                    <li>Contact Us</li> 
                </ul> 
            </div> 
                
            <div class="column"> 
                <p>Learn</p> 
                <ul> 
                    <li>Algorithms</li> 
                    <li>Data Structures</li> 
                    <li>Languages</li> 
                    <li>CS Subjects</li> 
                    <li>Video Tutorials</li> 
                </ul> 
            </div> 
                 
            <div class="column"> 
                <p>Practice</p> 
                <ul> 
                    <li>Company-wise</li> 
                    <li>Topic-wise</li> 
                    <li>Contests</li> 
                    <li>Subjective Questions</li> 
                </ul> 
            </div> 
        </footer> 
    </body> 
</html>

輸出：

瀏覽器支持：footer標簽是HTML5中的新增函數，它在瀏覽器中受支持，如下所示：

穀歌瀏覽器6.0
Internet Explorer 9.0
Firefox 4.0
Opera 11.1
Safari 5.0

相關用法

注：本文由純淨天空篩選整理自Shubrodeep Banerjee大神的英文原創作品 HTML5 | <footer> Tag。非經特殊聲明，原始代碼版權歸原作者所有，本譯文未經允許或授權，請勿轉載或複製。