html-列表和超链接(6)

最新推荐文章于 2024-05-01 15:27:58 发布

啦啦啦=_=

最新推荐文章于 2024-05-01 15:27:58 发布

阅读量416

点赞数

分类专栏： html css 文章标签： html

本文链接：https://blog.csdn.net/qq_45255696/article/details/114779595

版权

html css 专栏收录该内容

13 篇文章 0 订阅

订阅专栏

列表

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    
    <!--
        布局标签(结构化语义标签)
    -->

    <!--
        header 表示网页的头部
        main 表示网页的主体部分(一个页面中只会有一个main)
        footer 表示网页的底部
        nav 表示网页中的导航
        aside 和主题相关的其他内容(侧边栏)
        article 表示一个独立的文章
        section 表示一个独立的区块，上边的标签都不能表示时使用section

        div没有语义，就用来表示一个区块，目前来讲div还是我们主要的布局元素
        span行内元素，没有任何语义，一般用于在网页中选中文字
    -->

    <header></header>
    <main></main>
    <footer></footer>
    <nav></nav>
    <aside></aside>
    <article></article>
    <section></section>

    <div></div>
    <span></span>

</body>
</html>

超链接

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
        <!--
            超链接可以从一个页面跳转到另一个页面
            使用a标签来定义超链接
                属性:
                    href指定跳转的目标路径
                    值可以是外部网站，也可以是内部网站

            超链接是一个行内元素，在a元素标签中可以嵌套除它自身外的任何元素
        -->

        <a href="https://www.baidu.com">百度</a><br>
        <a href="列表.html">列表</a>
</body>
</html>

./可以忽略不写，如果不写./也不写…/则就相当于写了./

        ./表示当前文件所在的目录
        ../表示当前文件所在目录的上一级目录



 <!--超链接其他用法-->
    <!--
        target属性,用来指定超链接打开的位置
        值:
            _self 默认值  在当前页面打开超链接
            _blank 在一个新的网页打开超链接

    -->

    <!--
        点击超链接后，页面不会发生跳转，而是跳到当前页面的顶部的位置
    -->
    <a href="#">可以实现回到顶部</a>


    <!--
        可以跳转到页面的指定位置，只需将href属性设置#目标元素的id属性值

        id属性(唯一不重复的)
            每一个标签都可以添加一个id属性
            id属性就是元素的唯一标识，同一个页面不能出现重复的id属性

    -->