CSS: a: ссылка против просто a (без части: link) - PullRequest
13 голосов
/ 14 апреля 2010

Таким образом, мы должны использовать следующий порядок для псевдоклассов привязки CSS

a:link    { color: red }    
a:visited { color: blue }  
a:hover   { color: yellow } 
a:active  { color: lime }  

Но мой вопрос: зачем возиться с частью ссылки a:? Скорее, есть ли какое-либо преимущество к вышесказанному (кроме, возможно, ясности) над:

a { color:red; } /* notice no :link part */
a:visited { color: blue; }
etc.,etc.

Ответы [ 4 ]

13 голосов
/ 14 апреля 2010

:link выбирает не посещенные ссылки, то есть якоря с атрибутом href, которые не были посещены браузером (для любого определения, которое поставщик браузера имеет для "посещенных").

Если он имеет :link, то он никогда не будет соответствовать <h1><a name="foo">A foo to be linked to</a></h1>

(хотя вы должны использовать <h1 id="foo">A foo to be linked to</h1> в эти дни.)

Кроме того, он проясняет, для чего он нужен.

a         { color: orange }
a:link    { color: blue }    
a:visited { color: indigo }  
a:hover   { color: green } 
a:active  { color: lime }
  <a>my anchor without href</a>
  <br><br>
  <a href="http://somelinkhere.com">my anchor without href</a>

(они также имеют различные уровни специфичности )

8 голосов
/ 14 апреля 2010

Просто «a» относится ко ВСЕМ возможным ссылкам (не посещенным, посещенным, зависшим и активным), тогда как «a: link» относится только к обычным не посещенным ссылкам.

Если вы используете «a» вместо «a: link», вы устанавливаете CSS по умолчанию для ВСЕХ ссылок на любое значение «a». В этом конкретном случае, поскольку вы указываете каждый возможный псевдокласс, по существу не имеет значения, говорите ли вы «a: link» или просто «a»

Итак, в первой группе, где вы записываете все псевдоклассы (a: link, a: посещения и т. Д.), Вы указываете CSS для каждого возможного случая WITHIN «a»

a:link    { color: red }     //set unvisited links to red 
a:visited { color: blue }    //set visited links to blue
a:hover   { color: yellow }  //set hovered links to yellow
a:active  { color: lime }    //set active links to lime

Во второй группе, где вы просто пишете «a», вы фактически устанавливаете CSS по умолчанию для всех ссылок на то, что пишете в первой строке, а затем переопределяете CSS для других псевдоклассов

a    { color: red }          //set ALL links to red!
a:visited { color: blue }    //hm, never mind, let's set visited links to blue
a:hover   { color: yellow }  //hm, never mind, let's set hovered links to yellow
a:active  { color: lime }    //hm, never mind, let's set active links to lime
1 голос
/ 14 апреля 2010

http://www.w3schools.com/css/css_pseudo_classes.asp

: ссылка, когда ссылка не посещена. Поэтому, когда есть привязка с атрибутом href, и пользователь никогда не был на странице за привязкой.

0 голосов
/ 07 ноября 2013

Selector :link - селектор псевдоэлемента для гиперссылок, любой элемент, который является гиперссылкой, будет сопоставлен. Селектор a будет соответствовать «только» элементам привязки.

Обычно , каждый элемент a также является гиперссылкой, и я не знаю себя о любом способе создания гиперссылки в HTML без использования привязки, поэтому вы возможно, в большинстве случаев может использовать любой из них.

Однако использование только a будет соответствовать элементам привязки, которые не являются гиперссылками. Например, элемент привязки, написанный таким образом <a name=sign-up>Sign up form</a>, не будет соответствовать селектору псевдоэлемента :link гиперссылки, но будет соответствовать селектору a.

...