<!doctype html> <!-- 告诉浏览器当前是html文件 -->
<html>
<!-- head标签中内容是给浏览器看的,用户不感兴趣 <<选中你要注释掉的那段代码>>，按"ctrl+shift+/"就可以注释 一些编码,主要的基本设备,外部资源如CSS之类的-->
<head>
<meta charset="UTF-8">
<title>陌陌的故事</title>
<style type="text/css">
div{
width: 600px;
height: 350px;
border: 1px solid red;
/* background-color: yellow; */
padding: 15px;
background-image: url(images/buyiyang2.jpg);
background-size: 630px 380px;
background-repeat: no-repeat;
border-radius: 20px;box-shadow: 6px 6px 6px #999;
}
.text{
color: #36363;
line-height: 3em;
text-indent: 4em;
}
</style>
</head>
<!-- body的内容就是当前页面显示的内容 -->
<body>
<div>
<h3 style="color: brown;text-align: center;font-size: 40px;"
onmouseover="change(this)" onmouseout="old(this)">
陌陌:发现真实的距离
</h3>
<p>一对情侣每天 在陌陌陌聊天,彼此的距离始终是1000公里,某晚她回家后习惯的打开电脑,发现双方的距离只有1公里,再刷新,只有0.9公里,<br>她明白发生了什么,激动的走向了门口,当晚,他们的距离只有-0.5 厘米.</p>
<p>于是,第二天,他们还是分手了......</p>
</div>
<script type="text/javascript">
function change(element) {
element.style.fontSize ='40px' // 这里要分大小写
element.style.color='green'
}
function old(element) {
element.style.fontSize='20px' // 这里要分大小写
element.style.color='brown'
}
</script>
</body>
</html>