2018/3/15：第一节课作业：
感悟：js部分感觉比较困难，很多东西怎么调用的并不是特别清晰，html部分完成得比较简单。
作业完成效果截图：
![QW944N@]ZW)H4~X}ISH1K[1.png](https://img.php.cn//upload/image/524/616/854/1521188418576842.png "1521188418576842.png")
代码部分整理：
收藏
实例
<!DOCTYPE html>
<html>
<head>
<meta charset="{CHARSET}">
<meta charset="utf-8">
<title>海贼王介绍</title>
</head>
<style type="text/css">
body{
margin: 0;
padding: 0;
}
.main{
width: 550px;
height: 400px;
margin: 100px auto;
background:url(7504312_114017_6476.jpg);
background-repeat: no-repeat;
background-size: 590px 450px;
padding: 15px;
border-radius: 20px;
}
.main>h2{
color: brown;
text-align: center;
}
.main>h4{
color: crimson;
}
.main>span{
display: block;
line-height: 1.5em;
text-indent: 2em;
}
</style>
<body>
<div class="main">
<h2 onmouseover="colorchange(this)"onmouseout="oldcolor(this)">关于海贼王</h2>
<h4>海贼王是一部怎样的漫画？</h4>
<span>
《航海王》是日本漫画家尾田荣一郎作画的少年漫画作品，在《周刊少年Jump》1997年34号开始连载。改编的电视动画《航海王》于1999年10月20日起在富士电视台首播。
2012年5月11日，《航海王》获得第41回日本漫画家协会赏[1] 。截至2015年6月15日，《航海王》以日本本土累计发行了3亿2086万6000本，被吉尼斯世界纪录官方认证为“世界上发行量最高的单一作者创作的系列漫画”[2] 。2017年7月21日，日本纪念日协会通过认证，将每年的7月22日设立为“ONE PIECE纪念日”.
</span>
</div>
</body>
</html>
<script type="text/javascript">
function colorchange(element){
element.style.fontSize='24px'
element.style.color='#1874CD'
}
function oldcolor(element){
element.style.fontSize='20px'
element.style.color='#63BBFF'
}
</script>
运行实例 »
点击 "运行实例" 按钮查看在线实例运行实例 »点击 "运行实例" 按钮查看在线实例
---
手抄部分整理：
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
