多くの Web サイトを閲覧すると、一部の Web サイトでは、ナビゲーション バーのテキスト上にマウスを移動すると、単語が動いたり、フォントの色が変わったり、
上線が表示されたりすること
があります。今日は、San Shao がその方法を説明します。
実際、これは非常に簡単で、実際には CSS を使用して実装されています。私の手順に従ってください。Let' Go!
1. 個人ポータル管理を入力し、個人ポータル設定を選択し、テンプレートの選択を選択し、カスタム CSS を選択して を入力します。
2. CSS コードを見たことがありますか? 次のコードを見つけて
ください
。
マージン右: 自動;
マージンボトム: 0px;
マージン左: 自動;
幅: 956ピクセル;
背景色: #336666;
フォントサイズ: 12px;
色: #666666;
}#navi_bar a:link {
/*ナビゲーションバーのテキストの色*/
}#navi_bar a:visited {}
重要な手順は次のとおりです。
この後に次のコードを追加します。
#navi_bar a:hover{color:#000000;font-weight:bold;text-decoration:blink;background:#FF0000;font-size:18px}
#navi_bar a{表示:ブロック}
コードの説明: 1. color はマウスを移動したときの単語の色を表し、text-decoration はテキストの変更効果を表します。 選択できる属性は次のとおりです (なしは
ハイパーリンクに
下線がないことを意味し、下線はあります)。下線はテキストにハイパーリンクを追加し、上線はハイパーリンクされたテキストに線を追加します。また、
点滅
するとテキストが点滅します)。font-size はフォントのサイズを表します。ナビゲーション バーを動的にしたい場合、ここでのフォント サイズは
navi_bar a:link のフォント サイズより大きいため、選択する必要があります。 14px より大きいフォント。
2.navi_bar a{display:block} は表全体を色で塗りつぶすことを意味します。それ以外の場合はテキストのみを塗りつぶすことができます。