鼠标滑动没效果、给文字写颜色没效果原因

<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>