Необходимо сделать цветные ссылки

@DmitriyKaukin · Регистрация: 03.09.2016

Author24 — интернет-сервис помощи студентам

Получается хочу выделить ссылки по два цвета и первые две не трогать. Чтобы яндекс был красным, а гугл был чёрным. При этом не создавать классы. Заранее спасибо!

HTML5

<!DOCTYPE html>
<html>
    <meta charset="UTF-8">
    <link href="new4.css" rel="stylesheet" type="text/css" />
    <title></title>
</head>
<body>
 
<div>
    <ul>
        <li><a href="/">Главная</a></li>
        <li><a href="/news">Новости</a></li>
        <li><a href="http://ya.ru">Яндекс</a></li>
        <li><a href="https://mail.ya.ru">Яндекс.Почта</a></li>
        <li><a href="http://maps.yandex.ru"
               target="_blank">Яндекс.Почта</a></li>
        <li><a href="http://google.com">Google</a></li>
        <li><a href="http://maps.google.com">Google Maps</a></li>
        <li><a href="http://news.google.com">Google News</a></li>
    </ul>
</div>
 
</body>
</html>

@Fedor92 · 03.09.2016, 14:35

DmitriyKaukin, можно так поглумиться, если не будет других ссылок:

HTML5

<!DOCTYPE html>
<html>
    <meta charset="UTF-8">
    <link href="new4.css" rel="stylesheet" type="text/css" />
    <title></title>
</head>
<body>
    <style>
        a{text-decoration: none}
        a[href$=".ru"]{color:red}
        a[href$=".com"]{color:black}
    </style>
<div>
    <ul>
        <li><a href="/">Главная</a></li>
        <li><a href="/news">Новости</a></li>
        <li><a href="http://ya.ru">Яндекс</a></li>
        <li><a href="https://mail.ya.ru">Яндекс.Почта</a></li>
        <li><a href="http://maps.yandex.ru"
               target="_blank">Яндекс.Почта</a></li>
        <li><a href="http://google.com">Google</a></li>
        <li><a href="http://maps.google.com">Google Maps</a></li>
        <li><a href="http://news.google.com">Google News</a></li>
    </ul>
</div>
</body>
</html>

Можно заюзать nth-child...

@Resume · 03.09.2016, 15:34

Если использовать nth-child, как сказал Fedor92, то код следующий:

HTML5

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <link href="new4.css" rel="stylesheet" type="text/css" />
    <title></title>
</head>
<body>
    <style>
ul li:nth-child(6) a{
  color: black;
}
 
ul li:nth-child(3) a{
  color: red;
}
    </style>
<div>
    <ul>
        <li><a href="/">Главная</a></li>
        <li><a href="/news">Новости</a></li>
        <li><a href="http://ya.ru">Яндекс</a></li>
        <li><a href="https://mail.ya.ru">Яндекс.Почта</a></li>
        <li><a href="http://maps.yandex.ru"
               target="_blank">Яндекс.Почта</a></li>
        <li><a href="http://google.com">Google</a></li>
        <li><a href="http://maps.google.com">Google Maps</a></li>
        <li><a href="http://news.google.com">Google News</a></li>
    </ul>
</div>
</body>
</html>

Вы забыли добавить открывающий тэг <head>. В 3 строчке я его добавил

@DmitriyKaukin · 04.09.2016, 06:50 **[ТС]**

Fedor92, Спасибо помогло. Я просто не давно начал изучать и там в заданиях нужно было сделать. А у меня второй день не выходит, я не могу сделать и всё. Заклинило, а эти скобки, про них речь как раз и шла. А я забыл. А с nth-child там только для каждого элемента, а как формулу сделать, чтобы 3 ссылки красило и другие не трогало, до меня не доходило. Спасибо

@DmitriyKaukin 0 / 0 / 0 Регистрация: 03.09.2016 Сообщений: 3
	04.09.2016, 06:50 [ТС]	4
	Fedor92, Спасибо помогло. Я просто не давно начал изучать и там в заданиях нужно было сделать. А у меня второй день не выходит, я не могу сделать и всё. Заклинило, а эти скобки, про них речь как раз и шла. А я забыл. А с nth-child там только для каждого элемента, а как формулу сделать, чтобы 3 ссылки красило и другие не трогало, до меня не доходило. Спасибо 0

Необходимо сделать цветные ссылки

Решение