CSSのみで要素がス～っと出たり消えたりする方法

画像の場合

▼サンプル1
フェードイン（マウスオーバーしてみてください）

▼サンプル2
フェードアウト（マウスオーバーしてみてください）

テキストの場合

▼サンプル3
フェードイン（マウスオーバーしてみてください）

▼サンプル2
フェードアウト（マウスオーバーしてみてください）