hover狀態改變其他元素的樣式 和 解決text-overflow: ellipsis;不生效的問題

這兩個問題都是很基礎的問題，卻都忘了，不很熟練。希望以後記牢！

$~~~~$

<div id="father">

	<div id="son1">
		<div id="bro1">
		</div>
		<div id="bro2">
		</div>
	</div>
	
	<div id="son2">
	</div>
	
</div>

$~~~~$以上面代碼爲例，

$~~~~$兩個元素是父子關係,這樣做：

#father:hover #son2 {
	
}

$~~~~$兩個元素是兄弟關係，有相同父節點，並且兩個元素緊挨，這樣做：

#bro1:hover + #bro2 {

}

$~~~~$

text-overflow: ellipsis;
white-space: nowrap; 
overflow: hidden;

實現超出部分隱藏，並顯示 … 需要上面這三個屬性
white-space:設置文本不換行；text-overflow:設置溢出文本的處理辦法

如果想解決表格裏的問題，在table的樣式裏定義一個屬性 table-layout: fixed;

$~~~~$
鼠標移動上去時顯示被隱藏的文本內容，這樣做：

a:hover 
{ 
    text-overflow: inherit;
    overflow: visible;