这次主要写写自己碰到的难题：
首先是在div中划两条对角线：
附上参考的博文：https://www.cnblogs.com/chun6/p/6132258.html
使用旋转实现加入斜线。
我的代码：
background: linear-gradient(22deg, transparent 50%,black , black , transparent 50.1%),
linear-gradient(-22deg, transparent 50%, black, black, transparent 50.1%);
调整度数使得位置合适，调整透明度使得线条粗细符合条件，再就是颜色了。
下一个问题。
在页面上加上点击或鼠标移动到该位置出现下拉列表，之前一直想的是要创建一个下拉列表对象，一直写不出，后来网上找了很久，功夫不负有心人，找到了。
转换思想，做一个<ul><li>的列表形式，li先隐藏，当鼠标移动要出现下拉列表的ul上，将其li显示。
附上CSS代码：
ul
{
padding:5px 10px 0px 10px;
margin-right:10px;
height:70px;
display: block;
float:right;
color:black;
font-weight:bolder;
}
ul li
{
list-style-type:none;
display:none;
text-align:center;
}
ul:hover
{
color:gray;
}
#select:hover li
{
display: block;
}
li:hover
{
cursor:pointer;
color: black;
}
其中"#select:hover li"的意思是鼠标移动到id为#select时，触发这个标签里的li标签。
感谢这段代码：
HTML：http://line25.com/wp-content/uploads/2012/css-menu/demo/index.html
CSS:http://line25.com/wp-content/uploads/2012/css-menu/demo/style.css
接下来的一个问题就是检测用户是否登入，然后根据这个状态，显示欢迎语句或提示语句。
附上参考博文：http://blog.csdn.net/oaa608868/article/details/53539954
通过在注册页面将用户名保存在sessionStorage中，登入检测该变量是否为undefined，而将一个标签的innerHTML设置为不同的值，从而可以达到提示和欢迎的功能。
附上我的代码：
登入页面： if (code == '0'){
sessionStorage.setItem("name",username);
window.location.href="index.html";
}
首页页面：
html文件
<div class="inform" id="login"><a href="login.html">您好，您未登录，请先进行登入!</a></div>
<div id="div1">
js文件
function show(){
var username=sessionStorage.getItem("name");
if(username!=undefined)
{
document.getElementById('login').innerHTML="尊敬的"+username+",欢迎进入社团格子";
console.log(username);
}
}
window.onload=function(){
show();
}
最后，将鼠标移动到图片，图片放大：
代码：.photo img
{
margin-left:50px;
transition: all 0.6s
}
.photo img:hover
{
cursor: pointer;
transform: scale(1.05);
}
transform: scale(1.05):将图片放大为原来的1.05倍。
transition: all 0.6s:所有属性变化在0.6s内完成。
附上参考博文：http://blog.csdn.net/u014175572/article/details/51535768
总的来说这次做的还是挺顺利的，加油。