小编Enz*_*zio的帖子

我正在尝试创建一个“滑块”，用户可以在其中水平滚动以导航到某些“滑块项目”。但是，我正在尝试使用纯 css 创建它；我似乎无法让它正常工作。

开始：

结尾：

好吧，让我稍微解释一下图片。“窗口”中的所有内容都是可见的。这也意味着无序列表的溢出。我想要的是让用户能够在容器内水平滚动以移动无序列表。然而; 我不能在“容器”上使用overflow: hidden或overflow: scroll，因为它会隐藏我不想要的所有溢出内容。

我怎样才能做到这一点，或者甚至可以用纯 CSS 来实现？

我当前的代码：https : //jsfiddle.net/f0exzxkw/2/

我最近一直在研究 HTML 语义，我想知道它的真正目的<main>是什么。我创建了如下所示的两个场景：

场景一

     <main role="main">
        <header role="banner">
           <hgroup>
              <h1>Header 1</h1>
              <h2>Header 2</h2>
           </hgroup>

           <nav>
              <ul>
                 <li><a href="#">Link 1</a></li>
                 <li><a href="#">Link 2</a></li>
                 <li><a href="#">Link 3</a></li>
              </ul>
           </nav>
        </header>

        <section role="region">
           <header>
              <h1>Articles</h1>
           </header>

           <article>
              <header>
                 <h1>Article name</h1>
              </header>

              <p>Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</p>

              <footer>
                 <a href="#" title="Read more">Read this post</a>
              </footer>
           </article>

           <footer>
              <a href="#" title="Read more">Read this articles</a>
           </footer>
        </section>

        <footer role="contentinfo">
           <p>Page last updated <time datetime="2009-11-04">November 4th, 2009</time></p>
           <address> …