HTML超链接

HTML使用标签<a>来设置文本超链接。

超链接可以是文字,也可以是图片,点击这些内容跳转到新的文档或当前文档的某个部分

代码类似这样:

<a href="url">连接文本</a>

实例:

<!DOCTYPE HTML>

<html>
<body>
<a href="https:www.baidu.com">百度一下,你就知道</a>
</body> </html>

点击之后,会跳转到百度

HTML连接-target属性

定义被连接的文档在何处打开

将上面的实例修改一下

<!DOCTYPE HTML>

<html>
<body>
<a href="https:www.baidu.com" target="_blank">百度一下,你就知道</a>
</body> </html>

将target属性设置为_blank,连接将在新窗口打开

之前有提到过基本所有元素都可以加上id这个属性

可以理解为这个元素的唯一编号,一般来说同一个HTML文件id是不允许有重复的

超链接带上id这个属性,就可以直接跳转到这个id对应的元素。

<!DOCTYPE HTML>

<html>
<body>
<a href="https://blog.csdn.net/a54288447/article/details/80825125#article_content">回到第一个实例</a>
</body> </html>

上面的代码中,url是这篇文章的地址,article_content是第一个实例的id

带图片的超链接

<!DOCTYPE HTML>

<html>
<body>
<p>创建图片链接:
<a href="http://www.runoob.com/html/html-tutorial.html">
<img border="10" src="http://www.runoob.com/images/pulpit.jpg" alt="HTML 教程" width="32" height="32"></a></p> <p>无边框的图片链接:
<a href="http://www.runoob.com/html/html-tutorial.html">
<img border="0" src="http://www.runoob.com/images/pulpit.jpg" alt="HTML 教程" width="32" height="32"></a></p> </body> </html>

src是图片的地址

HTML学习笔记06-连接的更多相关文章

  1. 机器学习实战(Machine Learning in Action)学习笔记————06.k-均值聚类算法(kMeans)学习笔记

    机器学习实战(Machine Learning in Action)学习笔记————06.k-均值聚类算法(kMeans)学习笔记 关键字:k-均值.kMeans.聚类.非监督学习作者:米仓山下时间: ...

  2. iOS学习笔记06—Category和Extension

    iOS学习笔记06—Category和Extension 一.概述 类别是一种为现有的类添加新方法的方式. 利用Objective-C的动态运行时分配机制,Category提供了一种比继承(inher ...

  3. openresty 学习笔记四:连接mysql和进行相关操作

    openresty 学习笔记四:连接mysql和进行相关操作 毕竟redis是作为缓存,供程序的快速读写,虽然reidis也可以做持久化保存,但还是需要一个做数据存储的数据库.比如首次查询数据在red ...

  4. openresty 学习笔记三:连接redis和进行相关操作

    openresty 学习笔记三:连接redis和进行相关操作 openresty 因其非阻塞的调用,令服务器拥有高性能高并发,当涉及到数据库操作时,更应该选择有高速读写速度的redis进行数据处理.避 ...

  5. [Golang学习笔记] 06 程序实体3 类型断言和类型转换

    类型断言: 语法:<目标类型的值>,<布尔参数> := <表达式>.( 目标类型 ) // 安全类型断言<目标类型的值> := <表达式>. ...

  6. stm32寄存器版学习笔记06 输入捕获(ETR脉冲计数)

    STM32外部脉冲ETR引脚:TIM1-->PA12;TIMER2-->PA0:TIMER3-->PD2;TIMER4-->PE0… 1.TIM2 PA0计数 配置步骤 ①开启 ...

  7. [原创]java WEB学习笔记06:ServletContext接口

    本博客为原创:综合 尚硅谷(http://www.atguigu.com)的系统教程(深表感谢)和 网络上的现有资源(博客,文档,图书等),资源的出处我会标明 本博客的目的:①总结自己的学习过程,相当 ...

  8. Bash脚本编程学习笔记06:条件结构体

    简介 在bash脚本编程中,条件结构体使用if语句和case语句两种句式. if语句 单分支if语句 if TEST; then CMD fi TEST:条件判断,多数情况下可使用test命令来实现, ...

  9. NOSQL Mongo入门学习笔记 - C++连接Mongodb(三)

    OS环境: Centos 7.1 release X86_64 编译环境: G++ 4.8.3 已经成功搭建好了Mongodb,也初步在命令行中的查询与写入数据的基本方法,现在通过C++来连接Mong ...

  10. OpenCV 学习笔记 06 图像检索以及基于图像描述符的搜索

    OpenCV 可以检测图像的主要特征,然后提取这些特征,使其成为图像描述符,这些图像特征可作为图像搜索的数据库:此外可以利用关键点将图像拼接 stitch 起来,组成一个更大的图像.如将各照片组成一个 ...

随机推荐

  1. luogu2774 [网络流24题]方格取数问题 (最小割)

    常见套路:棋盘黑白染色,就变成了一张二分图 然后如果选了黑点,四周的白点就不能选了,也是最小割的套路.先把所有价值加起来,再减掉一个最少的不能选的价值,也就是割掉表示不选 建边(S,黑点i,v[i]) ...

  2. 字符串格式化format方法

    通过位置参数传参 print('{}, {}'.format('KeithTt', 18)) # KeithTt, 18 位置参数可以通过索引调用 print('{1}, {0}'.format('K ...

  3. HDU 1069 Monkey and Banana / ZOJ 1093 Monkey and Banana (最长路径)

    HDU 1069 Monkey and Banana / ZOJ 1093 Monkey and Banana (最长路径) Description A group of researchers ar ...

  4. 洛谷P3233 世界树

    题意:给定树上k个关键点,每个点属于离他最近,然后编号最小的关键点.求每个关键点管辖多少点. 解:虚树 + DP. 虚树不解释.主要是DP.用二元组存虚树上每个点的归属和距离.这一部分是二次扫描与换根 ...

  5. P1382 楼房 set用法小结

    这个sb题目,剧毒... STL大法好 首先,我准备用经典的线段树优化扫描线来做.之前的矩形周长把我困了数天导致我胸有成竹. 然后,敲代码半小时,调试半个月......这个,sb,怎么改都是0分+2个 ...

  6. 2018 ACM 网络选拔赛 北京赛区

    A Saving Tang Monk II #include <bits/stdc++.h> using namespace std; ; struct node { int x,y,z, ...

  7. (Catalan数 大数) Game of Connections poj2084

    Language: Game of Connections Time Limit: 1000MS Memory Limit: 30000K Total Submissions: 8837 Accept ...

  8. MUI 样式按钮的禁用

    1)如果是button,input等标签,可以     .attr("disabled",true)或者.attr("disabled","disab ...

  9. frp源码剖析-frp中的log模块

    前言&引入 一个好的log模块可以帮助我们排错,分析,统计 一般来说log中需要有时间.栈信息(比如说文件名行号等),这些东西一般某些底层log模块已经帮我们做好了.但在业务中还有很多我们需要 ...

  10. 不跳转修改url(history.pushState)

    有时候我们会想不跳转的情况下修改url 直接上代码吧: history.pushState(null,"","?test=123") 值得注意的是,为了用户安全 ...