我正在使用一个数据表,我正在使用传统的表格标记,但我想要的是我的表从页面的某个地方开始,我希望我的表格标题在它开始的地方固定,并且表格主体应该通过删除其余页面来滚动高度
我在这里显示一个小例子
https://codepen.io/avreddy/pen/eyYBdB?editors=1100
.datatable{
width: 50%;
border-collapse: collapse;
}
td{
text-align: center;
border: 1px solid;
padding:5px;
}Run Code Online (Sandbox Code Playgroud)
<body>
<div class="somecontent">
<h4>Some Content</h4><h4>Some Content</h4><h4>Some Content</h4>
</div>
<table class="datatable">
<thead>
<tr>
<th>col1</th>
<th>col2</th>
<th>col3</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
</tr>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
</tr><tr>
<td>1</td>
<td>2</td>
<td>3</td>
</tr><tr>
<td>1</td>
<td>2</td>
<td>3</td>
</tr><tr>
<td>1</td>
<td>2</td>
<td>3</td>
</tr><tr>
<td>1</td>
<td>2</td>
<td>3</td>
</tr><tr>
<td>1</td>
<td>2</td>
<td>3</td>
</tr><tr>
<td>1</td>
<td>2</td>
<td>3</td>
</tr><tr>
<td>1</td>
<td>2</td>
<td>3</td>
</tr><tr>
<td>1</td>
<td>2</td>
<td>3</td>
</tr><tr>
<td>1</td>
<td>2</td>
<td>3</td> …Run Code Online (Sandbox Code Playgroud)我正在使用flexbox css制作一个带有多个 div 的容器来水平滚动,但问题是当我尝试向容器添加更多 div 时,它移动到左侧并且显示左侧的 div 被隐藏。
我不明白这里发生了什么是代码片段和代码笔
.scroll{
display: flex;
flex-wrap: nowrap;
overflow-x: auto;
justify-content: space-evenly;
-webkit-overflow-scrolling: touch;
-ms-overflow-style: -ms-autohiding-scrollbar;
}
.item{
flex: 0 0 auto;
background: #e4e4e4;
width: 150px;
height: 150px;
margin: 10px;
}Run Code Online (Sandbox Code Playgroud)
<div class="scroll">
<div class="item">
</div>
<div class="item">
</div> <div class="item">
</div> <div class="item">
</div> <div class="item">
</div> <div class="item">
</div>
<div class="item">
</div> <div class="item">
</div>
<div class="item">
</div> <div class="item">
</div>
</div>Run Code Online (Sandbox Code Playgroud)
谢谢