0

このcssスクリプトでヘッダーの4つのリンクのみを選択する方法がわからないようです。それは私のウェブページ上のすべての私のリンクを緑にします。どうすればよいですか?試し1.ul{ css here}てみて、 1.a:link,1.a:visited; etc. And then onclass = '1'`を追加しましたが、それでもすべてのリンクがヘッダーリンクと同じになります。

<style>
ul
{
list-style-type:none;
margin:0;
padding:0;
overflow:hidden;
}
li
{
float:left;
}
a.a:link,a.a:visited
{
display:block;
width:120px;
font-weight:bold;
color:#FFFFFF;
background-color:#98bf21;
text-align:center;
padding:4px;
text-decoration:none;
text-transform:uppercase;
}
a.a:hover,a:active
{
background-color:#7A991A;
}

</style>
</head>

<body>
<ul class"a">
<li><a class='a' href="#home">Home</a></li>
<li><a class='a' href="#news">News</a></li>
<li><a class='a' href="#contact">Contact</a></li>
<li><a class='a' href="#about">About</a></li>
</ul>
4

2 に答える 2

3

それがまだ当てはまるかどうかはわかりませんが、クラスに数字を使用しようとすると、最初に文字がない限り機能しませんでした。いずれにせよ、数字はあまり意味的ではありません。id属性とclass属性を作成するときは、要素に何が含まれているかを説明する必要があります。

私はこれをします:

<ul id="main-menu">
    <li><a href="#home">Home</a></li>
    <li><a href="#news">News</a></li>
    <li><a href="#contact">Contact</a></li>
    <li><a href="#about">About</a></li>
</ul>

次に、CSSを次のように設定します。

#main-menu a { color: green; }

Mattiasが指摘したよう#main-menuに、リスト内のアンカーをターゲットにするたびに指定する必要があります#main-menu

#main-menu a:link, 
#main-menu a:visited {
    color: green;
}

これは次と同等です:

#main-menu a:link { color: green; }
#main-menu a:visited { color: green; }
于 2013-01-20T11:24:35.067 に答える
0

私はあなたのCSSを次のように変更しました:

<style>
ul
{
list-style-type:none;
margin:0;
padding:0;
overflow:hidden;
}
li
{
float:left;
}
a:link
{
display:block;
width:120px;
font-weight:bold;
color:#FFFFFF;
background-color:red; 
text-align:center;
padding:4px;
text-decoration:none;
text-transform:uppercase;
}

a:visited
{
display:block;
width:120px;
font-weight:bold;
color:#FFFFFF;
background-color:blue; 
text-align:center;
padding:4px;
text-decoration:none;
text-transform:uppercase;
}

a:hover
{
background-color:#7A991A;
}

a:active
{
background-color:purple;  
}
</style>

そしてそれはうまくいくようです。

基本的に、リンクの状態ごとにルールを分けて、状態ごとに色を変えられるようにしました。このページの右側のペインにあるルールを見てください: W3Schools

それが役に立ったかどうか教えてください

于 2013-01-20T11:37:39.983 に答える