CSSページレイアウト（ハイパーリンク形式）に関する常識のまとめ-CSSチュートリアル-php.cn

CSSページレイアウト（ハイパーリンク形式）に関する常識のまとめ

yulia

リリース： 2018-09-20 16:09:56

オリジナル

3100 人が閲覧しました

CSS には多くの知識があり、すべてを覚えるのは不可能です。暇なときに、CSS ページレイアウトに関する一般的な知識をまとめました。この記事では、CSS ハイパーリンクスタイルに関する一般的な知識を紹介します。困っている友達は参考にしていただければ幸いです。

Web ページをデザインするとき、疑似クラスを通じてリンクのスタイルを制御し、ユーザーが Web ページを閲覧できるようにガイドし、豊富なインタラクティブ要素を追加できます。

1. リンクの属性

Web ページ上のハイパーリンクは、通常、テキストやリンクにリンクするために使用されます。ピクチャー。。ハイパーリンクには、リンクのさまざまな状態を表す 4 つの疑似クラスがあります。

a: リンク (ハイパーリンクにアクセスする前のスタイル)

a: 訪問済み (リンクアドレスにアクセスした後のスタイル)

a: ホバー (マウスはホバリングスタイル)

a: アクティブ(マウスクリックからリリースまでのスタイル)

2. リンクの設定順序と継承

設定順序

4 つの疑似クラスの設定は、固定された順序で行う必要があります。そうしないと、望ましい効果が得られません。順序は、a: リンク、a: 訪問済み、a: ホバー、a: アクティブです。

継承

要素に対してテキストが定義されると、テキストの変更は継承できないことがわかります。スタイル、その子要素でスタイルをキャンセルすることはできません。ただし、擬似クラスを使用してハイパーリンクを定義する場合、テキスト変更を使用すると、サブ要素が元のリンクスタイルをオーバーライドできます。

3. 例

<html>
<head>
<style type="text/css">
    a:link{color:red;}
    a:visited{color:green;}
    a:hover{color:yellow;}
    a:active{color:orange;}
</style>
</head>
<body>
    <a href="https://www.baidu.com"> 超链接 </a>
</body>
</html>

ログイン後にコピー

以上がCSSページレイアウト（ハイパーリンク形式）に関する常識のまとめの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。