一周学习总结

感觉每一周都是忙碌的，过得十分的充实，我很满足。
这一周内做了很多的事，都是对我学习知识的检测。首先，应学长的要求做了qq邮箱登录页面的仿真，在制作的过程中，又是对html和css知识的温习，对每一个元素，样式，布局都很认真的完成，花了2个多小时，把除js外的部分全都完成了。这是html部分的代码

.input2{
display: none;
}
.we{
width: 400px;
height: 20px;
font-size: 15px;
font-weight: bolder;
position: absolute;
left: 80px;
top: 100px;
}
.input2 img{
position: absolute;
left:75px;
top: 125px;
width: 165px;
height: 165px;
transition:transform 1s;
}
.input2 img:hover{
transform: translateX(-25px);
}
.me{
width: 200px;
height: 25px;
text-align: center;
background-color: rgb(241,241,241);
position: absolute;
left: 57px;
top: 290px;
border-radius: 12px;
}
.input2 li{
display:inline-block;
border-right:1px solid slategray;
margin: -5px;
padding-right: 4px;
font-size: 13px;
color:steelblue;
}
.input2 ul{
position: absolute;
bottom: -34px;
right: -127px;
}
.le{
position: absolute;
bottom: 6px;
left: 15px;
margin-top: 10px;
height: 25px;
width: 25px;
}
.lp{
position: absolute;
bottom: 10px;
left: 41px;
font-size: 14px;
}

.footer{
height: 45px;
width:1536px ;
margin-top: 120px;
line-height: 45px;
background-color: rgb(239,244,250);
}
.footer p{
text-align:center;
font-size: 14px;
color: blue;
}
.gray{
color: gray;
}
之后又花时间做了js部分的代码
window.οnlοad=function(){

var left=document.getElementById(‘left’);
var right=document.getElementById(‘right’);
var input1=document.getElementsByClassName(‘input1’)[0];
var input2=document.getElementsByClassName(‘input2’)[0];
left.οnclick=function(){
input1.style.display=‘none’;
input2.style.display=‘block’;
};
right.οnclick=function(){
input2.style.display=‘none’;
input1.style.display=‘block’;
};
var content=document.getElementsByClassName(‘content’)[0];
var i=0;
function time(){
i++;
i=i%3;
content.style.background=‘url(img/’+i+’.png) no-repeat 610px 60px’;
};
setInterval(time,4000);

};
总体来说做完后还是很高兴的，但其间遇到的问题还是有一些的。
如有些元素布局错乱，没有做到我预期中的效果，但是又找不到问题，最后只能用定位，强制它移到那个位置。还有就是当页面缩小时，会发生布局错乱，原因是：设置weight和height属性时有的是px 应该用百分比,效果会好一点的。
总之，以后再制作网页的时候要更加的留意。