<div class="logo">
<div class="navbar"><a href="#">Messages</a></div>
<div class="personal">
<img src="images/xsj_03.png" class="trangle">
<div class="phtoto">
<a href="#"><img src="images/touxiang_03.png" alt="头像"></a></div>
<div class="wenzi">
<h3>Jordan j.</h3>
<p><a href="#">Administrrator</a></p> </div></a>
添加效果:鼠标滑动时,显示p标签下的文字,以及给本来颜色为蓝色的p标签变化颜色
知识点一:直接写.personal{color:bllue};并不会有效果;
原因:1.a标签自定义有颜色,因此,需要设置颜色时加上a 改为personal a{color:bllue};2.父元素给颜色了,需要查找(目前遇到的两种情况)
知识点二:
.trangle:hover h3{
color: #2399f1;
}
.trangle:hover p{
display: block;
}
用.trangle完全没反应?这个时候换成personal就可以有反应,原因:鼠标滑过后显示的元素必须鼠标点击内容的子元素,反之,鼠标点过的内容必须为父元素,不可为其他分支。
每天学习,继续补充!
</div>