初始化的HTML结构为,只需要在body里面加网页的标签和要显示的内容即可

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>page01</title>
</head>
<body> </body>
</html>

如:加个a标签,链接到外部资源

<h1>a标签为超链接</h1>
<!-- target="_blank" 在新标签中打开 -->
<a href="https://www.baidu.com/" target="_blank">百度</a>

链接到本地资源

<!-- 链接到本地资源 ../上一级-->
<a href="../page-02.html" target="_blank">去page02</a>

标签关联:点击问题一,跳转到问题一的答案 #id

<!-- 点击问题一,跳转到问题一的答案 #id-->
<a href="#as01" style="color: blue">问题一</a>
<p id="as01">问题一的答案</p>

浏览器不能解析的资源自动为下载链接

<!-- 浏览器不能解析的资源自动为下载链接 -->
<a href="../new1.zip">点击下载new1</a>

a标签自动连接到head的base的链接

  <base href="https://www.baidu.com/" target="_blank">
</head>
<body>

  <!-- href="contact.html" 会自动连接到上面head的base的链接 -->
  <a href="contact.html">联系我们</a>

a标签自动连接到head的base的链接

  <base href="https://www.baidu.com/" target="_blank">
</head>
<body>
  <!-- href="contact.html" 会自动连接到上面的base的链接 -->
  <a href="contact.html">联系我们</a>

返回顶端

<a href="#">返回顶端</a>


<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>page01</title>
<base href="https://www.baidu.com/" target="_blank">
</head>
<body>
<!-- href="contact.html" 会自动连接到上面的base的链接 -->
<a href="contact.html">联系我们</a> <p> </p> <!-- href="contact.html" 会自动连接到上面head的base的链接 -->
<a href="contact.html">联系我们</a> <p> </p>
<!-- 浏览器不能解析的资源自动为下载链接 -->
<a href="../new1.zip">点击下载new1</a> <p> </p>
<!-- 点击问题一,跳转到问题一的答案 #id-->
<a href="#as01" style="color: blue">问题一</a>
<p id="as01">问题一的答案</p> <!-- 链接到本地资源 ../上一级-->
<a href="../page-02.html" target="_blank">去page02</a> <h1>a标签为超链接</h1>
<!-- target="_blank" 在新标签中打开 -->
<a href="https://www.baidu.com/" target="_blank">百度</a> <a href="#">返回顶端</a> </body>
</html>

测开之路八十七:HTML之a标签的用法的更多相关文章

  1. 测开之路七十七:性能测试蓝图之js

    //定义全局的editor = nullvar editor = null; //ace_editor的初始化函数function ace_editor() { var editor = ace.ed ...

  2. 测开之路九十七:js的引用方式

    第一种:引用外部js文件 准备一个js文件 <!-- 引用外部的js --><script src="../js/js01.js"></script& ...

  3. 测开之路八十九:HTML之图片处理

    <!--width.height设置图片尺寸 alt:当图片不能展示时,显示的内容 title:鼠标放上去时展示的内容--> <img src="../imges/img0 ...

  4. 测开之路八十八:HTML之文本格式化

    准备一段文本内容 强调显示: <!-- b标签,加粗显示 --> <p><b>这是b标签的效果</b></p> <!-- strong ...

  5. 测开之路八十六:python操作sqlite

    创建sqlite数据库,并创建表和数据 python自带sqlite3库可以创建数据库文件 导入库:import sqlite3 创建游标,指定数据库名字:con = sqlite3.connect( ...

  6. 测开之路八十五:python处理csv文件

    写入csv文件 一:写入字典 二:写入普通数据 读取: 第一种:普通读取 第二种:读取csv并用namedtuple映射列名,类似于使用类的实例 第三种:字典形式 import csvfrom col ...

  7. 测开之路八十三:高级函数:map()和filter()

    # map(函数名,可迭代对象)# 给可迭代对象的每个值+5l = list(range(1, 21)) def add_number(x):    return x + 5 # 第一种方式print ...

  8. 测开之路八十二:匿名函数:lambda表达式

    # 匿名函数:lambda表达式# lambda 参数: 逻辑f = lambda name: print(name)f('tom') f2 = lambda x, y: x + yprint(f2( ...

  9. 测开之路八十一:参数定义之*args和**kwargs

    # *,不定长参数,*args# 定义函数参数def avg(score, *scores):    return (score + sum(scores)) / (len(scores) + 1) ...

随机推荐

  1. C语言双向链表讲解

    一.双向链表的概念 双向链表基于单链表.单链表是单向的,有一个头结点,一个尾结点,要访问任何结点,都必须知道头结点,不能逆着进行.而双链表添加了一个指针域,通过两个指针域,分别指向结点的前结点和后结点 ...

  2. 锋利的JS解读——认识JQuery(一)

    一.jQuery的发展 随着javascript的不断发展,延伸出了多种JS程序库,当前比较流行的js库有:1)Prototype  成型较早,从整体上对面向对象的编程思想把握的不是很到位. 2)Do ...

  3. Vue下简单分页及搜索功能

    最近利用Vue和element ui仿写了个小页面,记一哈分页和搜索功能的简单实现. 首页   emmmm..... 搜索框输入..... 搜索完成 数据是直接写在这里面的: cardPhoto:[ ...

  4. Android C# java 长连接框架

    mina框架详解 Apache Mina Server 是一个网络通信应用框架,也就是说,它主要是对基于TCP/IP.UDP/IP协议栈的通信框架(当然,也可以提供JAVA 对象的序列化服务.虚拟机管 ...

  5. window下lamp环境搭建

    软件: apache_2.2.25.msi php-5.4.30-Win32-VC9-x86.zip mysql-5.6.11-win32.msi下载地址:http://download.csdn.n ...

  6. 使用Docker搭建Jumpserver堡垒机

    使用Docker搭建Jumpserver堡垒机 1.环境准备 操作系统:CentOS 7.6.1810 软件源:阿里云镜像 #内核版本(Docker 要求 CentOS 系统的内核版本高于 3.10) ...

  7. ResultEntity

    就是封装的一个map集合  省时省力好用 package com.ujy.utils; import java.util.HashMap; import java.util.Map; public c ...

  8. JS中对象的定义及相关操作

    <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...

  9. 图像描点标注-labelme的安装及使用

    1.直接使用pip安装lebelme pip install labelme 2.labelme的使用 找到labelme的安装路径,先找到python的安装路径如我的,C:\Users\Think\ ...

  10. QKeyEvent

    #include<QKeyEvent>键盘事件由两个重载函数,实现即可:  void keyReleaseEvent(QKeyEvent *event);  void keyPressEv ...