第一次作业总结
<div class=".pic"><img src="beauty.jpg" alt="bicycle" title="bicycle">
<h4>Bicycle</h4>
</div>一开始想不到方法直接把这个代码了复制二十次
<script>
var html = '';
for (var i = 0; i < 20; i++) {
html += '<div class="box"><img src="beauty.jpg" title="bicycle" alt="bicycle" width=35%><h4>风景图</h4></div>';
}//这个可以改进，src后拼接不同的地址，实现显示不同图片。
document.write(html);
</script>后面找到用js循环实现的方法，就变得简便很多了
img:hover {
transform: scale(1.25);
cursor: zoom-in;
}鼠标放在图片上面时会变成放大镜，图片也会放大
<button onclick="next()">下一页</button>
<script>
function next() {
window.location.href = "task2-2.html";
}
</script>分页用onclick不知道怎么写，就写了两个页面，再通过链接跳转，链接跳转第一种：设置一个按钮，使用onclick事件触发next方法；
<a href="task2-2.html">下一页</a>
<style>
border:1px solid #000;
padding:6px 8px;
line-height:20px;
font-size:14px;
text-align:center;
</style>链接跳转第二种：通过a链接实现，css样式是为了模仿按钮。
第二次作业
<table>让页面更加整洁
<tr>
<td>
<h4>请输入数字：</h4>
</td>
<td><input type="text" id="num" value=""></td>
<td><input type="button" class="btn" value="确定" onclick="answer()"></td>
</tr>function answer() {
var mynum = document.getElementById("num").value;
time++;
if (mynum > num)
alert("很抱歉，你的数太大了。");
else if (mynum < num)
alert("很抱歉，你的数太小了。");
else {
var s = "恭喜你猜对了，此次游戏你一共用了" + time + "次猜对的,";
}
}通过onclick事件触发answer方法，并使用document.getElementById().value获取input里的value值。
这个方法括号内放引号不能忘了写，否则会找不到元素
function another_game() {
window.location.href = "task3-2.html";
}仍然使用作业一的按扭跳转页面
num = Math.round(Math.random() * 100 + 1);产生1~100的随机数
num = Math.round(Math.random() * (max - min - 1) + min + 1);产生min+1~max的随机数
.game table .btn {
background-color: #7fa1ad;
border: #7fa1ad 1px solid;
border-radius: 16px;
margin: 10px;
padding: 6px 8px;
outline: none;
/*去除点击时的蓝色边框*/
cursor: pointer;
color: #fff;
text-align: center;
font-size: 14px;
}按钮样式设计
background-size: cover;//此时会保持图像的纵横比并将图像缩放成将完全**覆盖**背景定位区域的最小大小。
background-size:contain;//此时会保持图像的纵横比并将图像缩放成将**适合**背景定位区域的最大大小。