本系列可作为前端学习系列的笔记,代码的运行环境是在HBuilder中,小编会将代码复制下来,大家复制下来就可以练习了,方便大家学习。小编作为新晋码农一枚,会定期整理一些写的比较好的代码,作为自己的学习笔记,会试着做一下批注和补充,如转载或者参考他人文献会标明出处,非商用,如有侵权会删改!欢迎大家斧正和讨论!
系列文章目录
HTML-1.1 文本字体样式-字体设置、分割线、段落标签、段内回车以及特殊符号
HTML-2.1 文本字体样式之加粗、斜体、回车、下划线、上标标签、下标标签以及字号变小和变大
HTML-2.2 列表--无序列表、有序列表、定义列表
HTML-2.3 超链接-外部链接,内部链接,书签链接
HTML-2.4 滚动字幕marquee
HTML-3.1 表格table
HTML-3.2 表格的跨行跨列(课表制作实例)
HTML中应用CSS样式的三种常见方法
HTML-3.3 表格布局(学校官网简易布局实例)
HTML-3.4 表单form
HTML-实战之 百度百科(影视剧介绍)
目录
系列文章目录
一、简单分析
1、外部链接
2、内部链接
3、书签链接
二、第二部分
总结
一、简单分析
1、外部链接
<h1>1.外部链接</h1><a href="http://www.baidu.com">百度</a><a href="http://www.baidu.com" target="_blank " title="我是用来提示的"><img src="../img/百度.png" width="100px"></a><br><a href="http://www.sohu.com" >搜狐</a><a href="http://www.sohu.com" ><img src="../img/搜狐.png" width="40px"></a><br>
注:图片自己找,然后存到指定位置
我这里是存在了上一层的同级img文件夹下
代码运行
2、内部链接
<h1>2.内部链接</h1><a href="1-1.html">文本</a><a href="../个人主题网站/index.html">返回首页</a>
代码运行
3、书签链接
<!-- 3.书签链接 a name 先起名字后叫他 a href="#name" --><h1>3.书签链接</h1><h2>庆余年</h2><a name="up"></a><h3>目录</h3><!-- <a href="#1"><a>点击跳转到相应位置 --><!-- <a name="up"></a>点击跳转到此 --><a href="#1">第一章</a><a href="#2">第二章</a><a href="#3">第三章</a><a name="1"></a><h3>第一章</h3><p>从前有个小男孩,他穿越了<br><br></p><a href="#up">返回顶部</a><aname="2"></a><h3>第二章</h3><p>小男孩来京城了<br><br></p><a href="#up">返回顶部</a><a name="3"></a><h3>第三章</h3><p>小男孩遇见鸡腿姑娘<br><br></p><a href="#up">返回顶部</a>
代码运行
二、第二部分
第二部分正文
HTML代码块如下:
<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>超链接-外部链接,内部链接,书签链接</title></head><body><!-- 1.外部链接 a 属性href name target titlie --><h1>1.外部链接</h1><a href="http://www.baidu.com">百度</a><a href="http://www.baidu.com" target="_blank " title="我是用来提示的"><img src="../img/百度.png" width="100px"></a><br><a href="http://www.sohu.com" >搜狐</a><a href="http://www.sohu.com" ><img src="../img/搜狐.png" width="40px"></a><br><!-- 2.内部链接,连接本网站的其他页面 --><h1>2.内部链接</h1><a href="1-1.html">文本</a><a href="../个人主题网站/index.html">返回首页</a><!-- 3.书签链接 a name 先起名字后叫他 a href="#name" --><h1>3.书签链接</h1><h2>庆余年</h2><a name="up"></a><h3>目录</h3><!-- <a href="#1"><a>点击跳转到相应位置 --><!-- <a name="up"></a>点击跳转到此 --><a href="#1">第一章</a><a href="#2">第二章</a><a href="#3">第三章</a><a name="1"></a><h3>第一章</h3><p>从前有个小男孩,他穿越了<br><br></p><a href="#up">返回顶部</a><aname="2"></a><h3>第二章</h3><p>小男孩来京城了<br><br></p><a href="#up">返回顶部</a><a name="3"></a><h3>第三章</h3><p>小男孩遇见鸡腿姑娘<br><br></p><a href="#up">返回顶部</a></body>
</html>
代码运行
总结
以上就是今天要讲的内容,本文简单记录了超链接-外部链接,内部链接,书签链接,仅作为一份简单的笔记使用,大家根据注释理解