Pasek informacyjny - html i css

pytanie zadane 26 stycznia w HTML i CSS przez info_matyk8 Nowicjusz (120 p.)

Hejka! Mam do was pytanie a za razem proszę o pomoc. Tworzę sobie w ramach nauki ruchomy pasek informacyjny w html i css taki jak np. w tvp info. Zrobiłem sobie taki pasek, natomiast mam problem - w tym pasku co jest np. w tvp info jest też zawarte nieskończone przesuwanie tekstu więc takie pytanie jakbyście to zrobili? Z góry dzięki za odpowiedzi. Poniżej mój kod.

<!DOCTYPE html>
<html lang="pl">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Barlow:wght@300&display=swap" rel="stylesheet">
    <title>Pasek info</title>
    <style>
        body {
            padding: 0;
            margin: 0;
            color: white;
            text-transform: uppercase;
            font-size:40px;
            font-family: 'Barlow', sans-serif;
        }
        
        #container
        {
            height:50px;
            background: red;
        }
    </style>
</head>
<body>
    <div id="container">
    <marquee>Wiadomości z kraju ze świata itp. ● Telewizja na żywo ● Z ostatniej chwili</marquee>
    </div>
</body>
</html>

1 odpowiedź

odpowiedź 27 stycznia przez VBService Ekspert (253,420 p.)
edycja 27 stycznia przez VBService

Na początek:

<marquee>: The Marquee element

Deprecated: This feature is no longer recommended. Though some browsers might still support it, it may have already been removed from the relevant web standards, ...

sprawdź np.: How to create a marquee that appears infinite using CSS

Może wypróbuj też biblioteki js-owej: Marquee3000 [ kod demonstracyjny on-line ]