如何冻结Sphinx中的第一列和第一行-前端问题

How to freeze the first column and first row in Sphinx(如何冻结Sphinx中的第一列和第一行)

本文介绍了如何冻结Sphinx中的第一列和第一行的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我是使用Sphinx的新手，我知道Phynx不是注定要用在桌子上的，但我想用它来记录我们的调查工具。因此，我创建了一个表格，其中包含在我们的调查问卷中询问的不同主题。自1984年开始我们的调查以来，我们有很多年的时间可以覆盖。

该表如下：

这些年(行)一直持续到最近一年，而且每年都会增长

当我在Sphnx中使用表格(CSV格式)时，它不会显示整个表格，只显示前几年，然后你必须滚动到一侧才能看到最近几年的情况。即使我改变了模板的宽度，它也不够宽，放不下桌子。

所以我的问题是。有没有办法固定/冻结第一列和第一行，这样你就可以看到主题和年份，即使你靠在一边看最近的年份？？

推荐答案

不在Sphinx中。相反，您可以使用css来实现这一点。请参见https://stackoverflow.com/a/1312678/2214933

您还需要自定义主题的css或模板，以包括一个单独的css文件来覆盖默认样式。请参阅Templating的Sphinx指南。

数据-lang="js"数据-隐藏="假"数据-控制台="真"数据-巴贝尔="假">

    table {
        border-collapse: collapse;
        font-size: 1.6em;
        width: 1000px;
    }
    table tr td:first-child {
        position: absolute;
        width: 7em;    /* match margin-left below */
        left: 0;
        top: auto;
        background-color: yellow;
        border-top-width: 1px;
    }
    td {
        border-collapse: collapse;
        border: 1px solid #ccc;
        padding: 3px;
    }
    div {
        width: 500px;
        overflow-x: scroll;
        margin-left: 12em;  /* match width above */
        overflow-y: visible;
        padding: 0;
    }

<div>
<table>
	<tr>
		<td>foofoofoofoofoo</td>
		<td>x</td>
		<td>x</td>
		<td>x</td>
		<td>x</td>
		<td>x</td>
		<td>x</td>
		<td>x</td>
		<td>x</td>
		<td>x</td>
		<td>x</td>
		<td>x</td>
		<td>x</td>
		<td>x</td>
		<td>x</td>
		<td>x</td>
		<td>x</td>
		<td>x</td>
		<td>x</td>
		<td>x</td>
		<td>x</td>
		<td>x</td>
		<td>x</td>
		<td>x</td>
	</tr>
	<tr>
		<td>barbarbarbar</td>
		<td>x</td>
		<td></td>
		<td>x</td>
		<td>x</td>
		<td>x</td>
		<td></td>
		<td>x</td>
		<td>x</td>
		<td></td>
		<td>x</td>
		<td>x</td>
		<td>x</td>
		<td>x</td>
		<td>x</td>
		<td></td>
		<td>x</td>
		<td>x</td>
		<td></td>
		<td>x</td>
		<td>x</td>
		<td>x</td>
		<td>x</td>
		<td>x</td>
	</tr>
</table>
</div>

这篇关于如何冻结Sphinx中的第一列和第一行的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持编程学习网！