• 九、非主体机构元素——header元素、footer元素、address元素、网页编排


    header元素

      一般用来放置整个页面的标题,比如说一个新闻页面,header一般放新闻的标题,如果是一个官方网址,一般header用来放logo和网站导航。

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>header元素</title>
    </head>
    <body>
        <header>
            <h1>IT最新技术</h1>
            <a href="http:///www.baidu.com">百度</a>
            <nav>
                <ul>
                    <li><a href="#">学习</a></li>
                </ul>
            </nav>
        </header>
    </body>
    </html>

    footer元素

       一般用来放置脚注,主要包含:作者信息、copyright。 

    address元素

       一般用来呈现联系信息,主要包括:网站的联系方式,电子邮箱,地址

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>address元素</title>
    </head>
    <body>
        <address>
            <a href="#">iwen</a>
            <a href="#">ime</a>
        </address>
    
        <footer>
            <div>
                <address>
                    <a href="#">ioj</a>
                    地址:***
                </address>
                <time datetime="2019-03-11">2019-03-11</time>
            </div>
        </footer>
    
    </body>
    </html>

     网页编排

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>网页编排</title>
    </head>
    <body>
        <header>
            <h1>网页标题</h1>
            <nav>
                <ul>
                    <li><a href="#">首页</a></li>
                </ul>
            </nav>
        </header>
    
        <article>
            <h1>文章主标题</h1>
    
            <p>文章正文</p>
            <section>
                <div>
                    <article>
                        <h1>评论标题</h1>
                        <p>评论正文</p>
                    </article>
                </div>
            </section>
        </article>
    
        <footer>
            <small>版权所有:....</small>
        </footer>
    </body>
    </html>
  • 相关阅读:
    2016/9/18结对编程之需求分析与原型设计。
    K米评测
    软件工程的实践项目课程的自我目标
    url学习1
    调研构建之法指导下的作品
    初次尝试对接
    第二次结对编程作业——毕业导师智能匹配
    uml
    Qt中采用cairo将图片导出至PDF
    SQL删除重复的记录(只保留一条)
  • 原文地址:https://www.cnblogs.com/gyqqqqq/p/10513314.html
Copyright © 2020-2023  润新知