HTML练习

最新推荐文章于 2024-07-21 17:23:08 发布

Cherry_Zj

最新推荐文章于 2024-07-21 17:23:08 发布

阅读量191

点赞数

分类专栏： HTML 文章标签： html

本文链接：https://blog.csdn.net/Cherry_Zj/article/details/115669647

版权

HTML 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

这里写目录标题

1.HTML练习
2.总结

1.HTML练习


<!doctype html>
<html>
	<head>
		<title></title>
	</head>
	<body>
	<center>
	<!--
	      跳转为id为bottom的元素所在位置
	      直接在href中写 #id属性值
	-->
	<a href="#bottom">去底部</a>
	<a href="#hello">去指定位置</a>
	<h1>这是我的个人博客</h1>
	<hr>
	<h2>沁园春·雪</h2>
	<!--创建超链接时，如果地址不正确可以直接写一个#作为占位符，并不会跳转到另一页面-->
	<a href="#">毛泽东</a>
	<p id="hello">
	北国风光，<br />
	千里冰封，<br />
	万里雪飘。<br />
	望长城内外，惟余莽莽；<br />
	大河上下，顿失滔滔。<br />
	山舞银蛇，原驰蜡象，<br />
	欲与天公试比高。<br />
	<img src="1.jfif" alt="毛泽东所写的诗" width="400px" /><br />
	须晴日，<br />
	看红装素裹，分外妖娆。<br />
	江山如此多娇，引无数英雄竞折腰。<br />
	惜秦皇汉武，略输文采；<br />
	唐宗宋祖，稍逊风骚。<br />
	一代天骄，成吉思汗，<br />
	只识弯弓射大雕。<br />
	俱往矣,<br />
	数风流人物，<br />
	还看今朝。<br />
	</p>
	<hr />
	友情链接：<a href="#">A网站</a> | <a href="#">B网站</a> | <a href="#">C网站</a><br /><br />
	
	<!--
	       如果将超链接的地址设置为#，则点击以后，会自动跳转到当前页面的底部
	     
	       html中有一个属性，每个元素都可以设置，该属性可以作为标签的唯一标识
	       这个属性就是id
	-->
	<a id="bottom" href="#">回到顶部</a> |

	<!--
	     发送邮件的超链接。点击链接后可以自动打开计算机中默认的邮件客户端
	     href="mailto:邮件地址"
	     当点击这个超链接时，会默认打开计算机的默认电子邮件客户端，并且将收件人设置为mailto后的邮件地址
		 若计算机中无电子邮件客户端，则无法显示
	-->

	 <a href="#mailto abc@qq.com">联系我们</a>
	</center>
	</body>
</html>

效果图：
在这里插入图片描述

2.总结

1.href属性中可以写一个#
作用：
①如果地址不正确可以直接写一个#作为占位符，并不会跳转到另一页面。
②如果将超链接的地址设置为#，则点击以后，会自动跳转到当前页面的底部。
2.href="mailto:邮件地址"
当点击这个超链接时，会默认打开计算机的默认电子邮件客户端，并且将收件人设置为mailto后的邮件地址。若计算机中无电子邮件客户端，则无法显示
3. html中有一个属性，每个元素都可以设置，该属性可以作为标签的唯一标识，这个属性就是id。

使用：即示例：
若点击去底部，则会跳转到id为bottom所在的位置

<!--
	      跳转为id为bottom的元素所在位置
	      直接在href中写 #id属性值
	-->
	<a href="#bottom">去底部</a>
	
	<a id="bottom" href="#">回到顶部</a> |

Cherry_Zj

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
2
评论
HTML练习

这里写目录标题1.HTML练习2.总结1.HTML练习<!doctype html><html> <head> <title></title> </head> <body> <center>  <a href="#bottom">去底部</a
复制链接

扫一扫