博客列表 >3-16手记

3-16手记

罗树的博客
罗树的博客原创
2018年03月16日 18:02:11527浏览
  • 代码演示:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>3-16-php</title>
<style type="text/css">
body{
padding: auto;
}
.main{
height: 300px;
width: 500px;
text-align: center;
margin: auto;
padding: 20px;
background-image: url(image/flower.jpg);
background-repeat: no-repeat;
background-attachment:fixed;
background-position:center;
font-family: PingFangSC-Regular, Verdana, Arial, 微软雅黑, 宋体;
}
p{
color: black;
margin: 20px;
line-height: 16px;
font-size: 18px;
}
</style>
</head>
<body>
<div>
<h3 onmousemove="changeTo(this)" onmouseout="changeBack(this)">登科后</h3>
<p>昔日龌龊不足夸,</p>
<p>今朝放荡思无涯。</p>
<p>春风得意马蹄疾,</p>
<p>一日看尽长安花。</p>
</div>
<script>
      function changeTo(element){
           element.style.color="red"
           element.style.fontSize="30px"
      }
      function changeBack(element){
           element.style.color="black"
           element.style.fontSize="24px"
      }
</script>
</body>
</html>

  • 手写代码:微信图片_20180316175626.jpg

  • 演示效果:

2018-03-16_180443.png


上一条:3-15作业下一条:html体验案例
声明:本文内容转载自脚本之家,由网友自发贡献,版权归原作者所有,如您发现涉嫌抄袭侵权,请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言,请遵守新闻评论服务协议