HTML个人博客页面
2018-11-16 本文已影响0人
邵毅超
知识点总结：下面的是一个个人博客页面，歌词的段落用的时“p”标签，超链接为“a”标签。
包括鼠标经过的事件：颜色变换；去顶部去底部和指定位置：写入的锚点，点击后可以到制定位置。
刚开始学习html我们可以使用“center”标签来居中段落的文字，
<html lang="en">
<head>
<meta charset="UTF-8">
<title>wtm的博客</title>
<style type="text/css">
a{
text-decoration: none;
color: #000;
}
a:hover{
text-decoration: underline;
color: orange;
}
</style>
</head>
<body>
<center>
<a href="#b" id="a">去底部</a><a href="#c">去指定位置</a>
<h1>这是我的博客
<hr>
<h2><a href="#">微微一笑很倾城</a></h2>
<a href="#">汪苏泷，刘颜嘉</a>
</h1>
<p>雨水滴在我的外套</p>
<p>思念浸透我的衣角</p>
<p>你给的暗号</p>
<p>微微一笑</p>
<p>出现的刚刚好</p>
<p>擦肩而过你的发梢</p>
<p>像是春风吹绿青草</p>
<p>浪漫在发酵</p>
<p>只愿为你</p>
<img src='./img/0.jpg' />
<p>赶走所有烦恼</p>
<p>带你到天涯海角</p>
<p>听你的心跳</p>
<p>想给你一个拥抱</p>
<p>让全世界知道</p>
<p>遇见你我才知道你对我多重要</p>
<p>没有人能感觉到你最甜美的笑</p>
<p>我再不用把别人寻找</p>
<p>因为我已经找到</p>
<p>我们的缘分刚好不许别人打扰</p>
<a href="#" id="c"></a>
<img src="./img/timg.jpg" width=400 height=280>
<p>搭配爱情的美妙只有我们知道</p>
<p>紧紧围绕你每分每秒</p>
<p>你对我多么重要</p>
<p>擦肩而过你的发梢</p>
<p>像是春风吹绿青草</p>
<p>浪漫在发酵</p>
<p>只愿为你</p>
<p>赶走所有烦恼</p>
<p>带你到天涯海角</p>
<p>听你的心跳</p>
<p>想给你一个拥抱</p>
<p>让全世界知道</p>
<p>遇见你我才知道你对我多重要</p>
<p>没有人能感觉到你最甜美的笑</p>
<p>我再不用把别人寻找</p>
<a href="http://www.kugou.com/">A网站</a>>
<a href="https://y.qq.com/">B网站</a>>
<a href="#a" id='b'>去顶部</a>
</center>
<hr>
</body>
</html>
