JSFiddle - React, Tailwind, and code Playground

by dotnil

HTML

<marquee direction="up" behavior="alternative" loop="-1" scrolldelay="200" scrollamout="3">
    <p>弃我去者昨日之日不可留，</p>
    <p>乱我心者今日之日多烦忧。</p>
    <p>长风万里送秋雁，对此可以酣高楼。</p>
    <p>蓬莱文章建安骨，中间小谢又清发。</p>
    <p>俱怀逸兴壮思飞，欲上青天揽明月。</p>
    <p>抽刀断水水更流，举杯销愁愁更愁。</p>
    <p>人生在世不称意，明朝散发弄扁舟。</p>
</marquee>

CSS

body {
    font: 14px/1.5 normal "Hiragino Sans GB", Tahoma, "Microsoft Yahei", Helvetica, Arial, sans-serif;
    text-align: center;
    height: 160px;
    margin: 0;
    padding: 0;
}

marquee {
    text-align: left;
    margin: 60px auto 0;
    height: 20px;
    width: 240px;
    padding: 5px 10px;
    background: #f0f0f0;
    border-radius: 2px;
    box-shadow: #ddd 0 0 5px inset;
    border: 1px solid #ddd;
}

p:last-child {
    color: #505050;
}