Проблема с: посетил на занятии.Почему: посещенные работают нормально, а .myarticle: посещенные нет? - PullRequest
0 голосов
/ 12 марта 2019

<!-- Style of myarticle-->
.myarticle{
    width: 300px;
    padding: 10px;
    margin: 2px 5px 0px 0px;
    border: 1px solid black;
    background-color: bisque;
    text-align: center;
    display: flex;
    flex-direction: column;
    background-color: graY;
}

a:link{
    color: silver;
}
 <!--The thing, I don't understand. .myarticle:visited does nothing, ??-->
a:visited, .myarticle:visited{
    background-color: white;
    border-radius: 20px;
    color: black;
}
.myarticle:hover{
    width: 300px;
    padding: 10px;
    margin: 2px 5px 0px 0px;
    border: 1px solid #67B9B3;
    background-color: #224341;
}

a{
    text-decoration: none;
}

  
.myarticle:active{
    width: 300px;
    padding: 10px;
    margin: 2px 5px 0px 0px;
    border: 1px solid #67B9B3;
    background-color: #224341;
}
 <!-- main -->
.mymain{
    width: 70%;
    padding: 5px;
    height: 350px;
    background-color: sienna;
    border: 2px solid peru;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}
 <!-- Footer -->
.headfoot{
    width: 70%;
    padding: 5px;
    border: 2px solid peru;
    background-color: sandybrown;
    text-align: center;
}
<!DOCTYPE html>
<html lang="en" dir="ltr">
    <head>
       
        <meta charset="utf-8">
        <link rel="stylesheet" href="Green.css">
        <title>Cyan</title>
    </head>
    <body>    
        <header class="headfoot">Kopfzeile</header>
            <main class="mymain">
                   <!--Hyperlink reference (a)-->
                    <a href="index.html">
                     <!-- first article -->
                    <article class="myarticle article01">
                            <h1>Artikel (1)</h1>
                            <p>Lorem ipsum dolor...</p>
                    <a href="index.html">
                    <!-- second article -->
                    <article class="myarticle article02 unten">
                        <h1>Artikel (2)</h1>
                        <p>Lorem ipsum dolor...</p>
                    </article></a>
                    <a href="https://www.youtube.com/watch?v=IumYMCllMs" >
                      <!-- third article -->
                    <article class="myarticle article03">
                        <h1>Artikel (3)</h1>
                        <p>Lorem ipsum dolor...</p>
                    </article><a/>
            </main>
        <footer class="headfoot">
        Fußzeile
        </footer>
    </body>
</html>

Я не знаю, почему это не работает. Может ли кто-нибудь объяснить мне, где моя вина? Почему .myarticle: посетил не работает нормально?: (

[Я пытаюсь изменить стиль myarticle, если ссылка a посещена. Но я немного расстроен на самом деле. Я не знаю, в чем моя вина. Каковы правила для: посещен, это вызвано неправильным использованием? Как мне написать это тогда?]

1 Ответ

1 голос
/ 12 марта 2019

, поскольку .myarticle нельзя "посетить", я бы сказал:

a:visited, a:visited > .myarticle{
    background-color: red;
    border-radius: 20px;
    color: black;
}

Вместо:

<!--The thing, I don't understand. .myarticle:visited does nothing, ??-->
a:visited, .myarticle:visited{
    background-color: white;
    border-radius: 20px;
    color: black;
}

:visited статус применяется к ссылкам, вы не можете применить его к article пунктам

...