今天完成的事情：写完了编程王的首页，搭建了关于我们页面的结构

明天计划的事情：写关于我们页面的样式，写游戏页面的结构

遇到的问题：侧边栏那里的联系电话不知道怎么写好

收获：line-height和height的区别

line-height是行高的意思，height是定义元素自身的高度。

如果设置line-height为20px，那么这个元素的实际高度将取决于其中内容的多少，假如文字部分在浏览器里面显示为一行，那么这个div的实际高度就是20px，如果文字显示为两行，那么div的实际高度就是40px，而且文字的行高是20px的。

如果设置height为40px，那么这个元素的实际高度一般并不会因为内容的多少而发生改变，如果文字显示为一行，那么这个div的高度仍然是40px，如果显示为2行，但是文字的行高不够20px，这个div的高度也不会因为文字内容的高度小于height而发生改变。不过如果文字内容的高度大于40px了，一般来说这个div的高度还是会相应增加的。

右边的侧边栏有一个hover效果，即使用hover效果实现元素的显示与隐藏。

实现方法：

将图片和文字放到父元素中，当鼠标放在父元素上时，图片隐藏，文字则显示出来。

hover的写法

<div class="father">
    <div class="img">
  ....
   </div>
   <div class="text">
  .....
   </div>
</div>

css

//先把文字隐藏起来

.text {

display:none;

}

//使用hover，当鼠标放在父元素上时，文字出现，图片则被隐藏起来。

.father:hover .text {

display: block;

}

.father:hover .img {

display:none;

}

隐藏有两种写法一种是display:none;   另一种是visibility:hidden;

display:none;表示被隐藏的元素不占据空间，visibility:hidden;表示被隐藏的元素占据空间。