zoukankan      html  css  js  c++  java
  • HTML--Boby部分之<a>标签

     随笔记录方便自己和同路人查阅。

    #------------------------------------------------我是可耻的分割线-------------------------------------------

    <a>标签主要用来做超链接跳转,不能提交到数据库,还可以做锚,<a>标签是行内标签

    <a>标签之超链接

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>input系列</title>
    </head>
    <body>
        <a href="http://www.baidu.com">百度</a>
    </body>
    </html>

    结果展示:

    点击百度会跳转到百度首页

    <a>标签之锚

    锚是用来在同意页面做跳转的,和目录差不多,锚需要锚点,用ID实现

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>input系列</title>
    </head>
    <body>
        <a href="#i1">第一章</a>
        <a href="#i2">第二章</a>
        <a href="#i3">第三章</a>
        <a href="#i3">第四章</a>
        <div id="i1" style="height:600px;">第一章的内容 </div>
        <div id="i2" style="height:600px;">第二章的内容 </div>
        <div id="i3" style="height:600px;">第三章的内容 </div>
        <div id="i4" style="height:600px;">第四章的内容 </div>
    </body>
    </html>

    锚是通过id属性来关联的,id属性不能重复

    结果展示:

    这样锚就做好了,点击第二章会直接跳转到第二章内容

  • 相关阅读:
    node-red 使用 创建第一个流程
    node-red 安装
    docker postgres 导出导入数据
    6大设计模式(转)
    常见的算法
    @Autowired与@Resource的区别
    Elasticsearch
    redis搭建主从复用-读写分离
    转载redis持久化的几种方式
    后台启动mysql
  • 原文地址:https://www.cnblogs.com/lirongyang/p/11250696.html
Copyright © 2011-2022 走看看