HTML和CSS表,具有固定的标题和固定的列,且未设置高度

时间:2018-06-27 14:35:17

标签: javascript html css sass

我需要创建一个表,该表具有固定的标题和两个没有设置高度的固定列。粘性表格标题无法正常工作,因为表格周围有覆盖层。

SCSS

.container{
   width: 300px;
   overflow-x: auto;
   table{
     width: 100%;
     thead{
       tr{
         th{
           text-align:left;
           border: 1px solid black;
           padding: 10px;
         }
         &.sticky-header{
           th{
             position: sticky;
             top: 0;
             background-color: #ffffff;
           }
         }
       }
     }
     tbody{
       tr{
         td{
           min-width: 100px;
             border: 1px solid black;
             padding: 10px;
         }
       }
     }
   } 
 }

请参见http://jsfiddle.net/0pq3uL6k/82/作为示例。

谢谢!

0 个答案:

没有答案