Here's a code

```
 <a id="link1" href="#" >About</a>
 <a id="link2" href="#">Contact us</a>

```

I want the link1's color to be changed when link2 is hovered.
Is it possible with css?.
['https://Stackoverflow.com/questions/29598991', 'https://Stackoverflow.com', 'https://Stackoverflow.com/users/4466855/']
Since CSS does not seem to be able to handle this, try JavaScript

```js
window.onload=function() {
  document.getElementById("link2").onmouseover=function() {
    document.getElementById("link1").style.color="red";
  }
  document.getElementById("link2").onmouseout=function() {
    document.getElementById("link1").style.color="blue";
  }
}
```

```html
 <a id="link1" href="#" >About</a>
 <a id="link2" href="#">Contact us</a>
```

Or using siblings

```js
function prevSib(elem) {do { elem = elem.previousSibling;} while ( elem && elem.nodeType !== 1 ); return elem; }

window.onload=function() {
  document.getElementById("link2").onmouseover=function() {
    prevSib(this).style.color="red";
  }
  document.getElementById("link2").onmouseout=function() {
    prevSib(this).style.color="blue";
  }
}
```

```html
<a id="link1" href="#" >About</a>
<a id="link2" href="#">Contact us</a>
```
I suppose this is what are you looking for.  

First you need to wrap your links inside a container like this

```
<div class='container'>
    <a id="link1" href="#" >About</a>
    <a id="link2" href="#">Contact us</a>
</div>

```

and then apply this styles

```
.container:hover a:not(:hover){
    color:red;
}

```

[css only demo here](https://jsfiddle.net/g39yyk9n/)  

**UPDATE**  

As I said in may comment bellow I supposed you wanted to change the style of all unhovered links, however if you want to change only link1 when link2 is hovered , but not change style of link2 when link1 is hovered you could write you css like this  

[second demo](https://jsfiddle.net/g39yyk9n/1/)

```
.container:hover a:first-child:not(:hover){
    color:red;
}

```