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属性不能重复

    结果展示:

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

  • 相关阅读:
    CSP-S全国模拟赛第三场 【nan死了】
    ●SCOI2018 AFO
    ●洛谷P2934 [USACO09JAN]安全出行Safe Travel
    ●洛谷P3233 [HNOI2014]世界树
    ●洛谷P2495 [SDOI2011]消耗战
    ●UOJ58 [WC2013]糖果公园
    ●洛谷P1903 [国家集训队]数颜色
    ●BZOJ 4237 稻草人
    ●Joyoi Normal
    ●CodeForces 698C LRU
  • 原文地址:https://www.cnblogs.com/lirongyang/p/11250696.html
Copyright © 2011-2022 走看看