如何使 lstlisting 与 tex4ht 在具有固定列宽的表格中一起工作?

如何使 lstlisting 与 tex4ht 在具有固定列宽的表格中一起工作?

我正在生成一个具有固定宽度和p规格的表格。我需要在一列中放置一些文本,这些文本应该是逐字逐句的,可能只有几行,因此它也必须在列中自动换行,因为它是p

verbatim 环境不起作用。它们不会换行以适应列宽。我也尝试将它们放在与列宽度相同的 minipage 中。但仍然没有换行。所以我放弃了使用 verbatim。

唯一有效的方法是使用listings。现在文本将换行以适合列宽,并且在某种意义上是逐字逐句的。

剩下要解决的唯一问题就是让它与 tex4ht 一起工作。

它不会在 HTML 中换行,整个列表内容显示在一行中,这使得表格即使对于 HTML 来说也很宽。如果我删除环境listing,它当然会换行,但文本不再是逐字的。它是普通文本,这会导致问题。

尽管我确定我正在使用p并且也使用p-widthmake4ht 选项。

如何使 tex4ht 中的列表功能与 PDF 中的功能相同?文本必须是单行文本或列表文本,因为其内容可以包含字符,否则会引起麻烦。

这是一个 MWE。

\documentclass[12pt]{book}
\usepackage{longtable}
\usepackage{fancyvrb}
\usepackage{listings}
\lstset{
basicstyle=\footnotesize,
breaklines=true
}   
\begin{document}
\begin{tabular}[c]{|p{0.4in}|p{0.4in}|p{0.4in}|p{2.2in}|p{2.2in}|}\hline
1&66&203&-2 (exception)\newline
\begin{lstlisting}
Exception raised: RuntimeError >> ECL says: THROW: The catch RAT-ERR is undefined.
\end{lstlisting}
& 1 (pass) \\\hline
\end{tabular}    
\end{document}

这一切在 pdf 中都能正常工作。

在此处输入图片描述

编译为 HTML 后得到

   make4ht -a debug foo.tex "htm,p-width"

在此处输入图片描述

所以它没有包装。

我查看了其他相关问题,但没有找到使用 tex4ht 在表格内列出此类列表并保持列宽固定的解决方案。

tex4ht:如何创建固定宽度的表格列

在 htlatex 中使用 mathml 会导致生成的 html 中丢失表格 p 宽度规范

有什么解决方法吗?

使用 TL 2021

更新

我尝试了给出的解决方案,但对于较大的示例,它似乎无法换行。HTML 中的列仍然很宽。下面是另一个示例。

\documentclass[11pt]{article} 
\usepackage{longtable}
\usepackage{listings}
\lstset{
basicstyle=\footnotesize,
breaklines=true
}        
\begin{document}
       
\begin{longtable}[c]{|p{0.4in}|p{0.4in}|p{0.4in}|p{2.2in}|p{2.2in}|}\hline
1&5&193&0 (not solved)& 1 (pass) \\ 
2&10&466&0 (not solved)& 1 (pass) \\ 
39&33&320&-2 (exception)\newline 
\begin{lstlisting}
Exception raised: TypeError >> An error occurred running a Giac command:INPUT:sage2:=int(sage0,sageVARx):;OUTPUT:Warning, integration of abs or sign assumes constant sign by intervals (correct if the argument is real):Check [abs(t_
\end{lstlisting}
& 1 (pass) \\ 
40&33&841&0 (not solved)& 1 (pass) \\ 
45&33&1954&-2 (exception)\newline 
\begin{lstlisting}
Exception raised: TypeError >> An error occurred running a Giac command:INPUT:sage2:=int(sage0,sageVARx):;OUTPUT:index.cc index_m i_lex_is_greater Error: Bad Argument Value
\end{lstlisting}
& 1 (pass) \\ \hline
\end{longtable}    
                       
\end{document}

使用编译

 make4ht -a debug -c a.cfg foo.tex "htm,mathjax,p-width"

其中 a.cfg 是

\Preamble{xhtml}
\Css{table .lstlisting{ white-space: pre-wrap; }}
\begin{document}
\EndPreamble

使用 Brave 浏览器可获得以下结果

在此处输入图片描述

和以前一样。所以pre-wrap;没有效果。

在 FireFox 浏览器上效果稍好一些

在此处输入图片描述

在 Chrome 浏览器上,它给出的结果与 Brave 相同。在 Edge 浏览器上,它给出的结果也与 Brave 相同。因此,FireFox 浏览器表现最佳。但在所有情况下,它都无法像 PDF 那样换行。我需要列宽相同,并且逐字文本可以换行。这难道不可能吗?

与 PDF 比较

在此处输入图片描述

更新

找到了一种直接在 HTML 中执行此操作的方法。所以现在只需要弄清楚如何将其转换为 tex4ht .cfg。这是在 HTML 中执行此操作的方法。

<!DOCTYPE html> 
<html lang='en-US' xml:lang='en-US'> 
<head><title></title> 
<meta charset='utf-8' /> 
<style>
td { border: 1px solid #000; padding: 5px; max-width: 2.3in;  white-space: wrap; overflow: hidden;}

pre {
            overflow-x: auto;
            white-space: pre-wrap;
            white-space: -moz-pre-wrap;
            white-space: -pre-wrap;
            white-space: -o-pre-wrap;
            word-wrap: break-word;
         }
         
</style>
</head><body>
<table>
    <tr>
        <td> 1</td>
        <td> 5</td>        
        <td> 193</td>        
        <td> 0 (not solved)</td>    
        <td> 1 (pass)</td>     
    </tr>        
    <tr>
        <td> 1</td>
        <td> 5</td>        
        <td> 193</td>        
        <td> -2 (exception) <pre>Exception raised: TypeError >> An error occurred running a Giac command:INPUT:sage2:=int(sage0,sageVARx):;OUTPUT:Warning, integration of abs or sign assumes constant sign by intervals (correct if the argument is real):Check [abs(t_ </pre> </td>
        <td> 1 (pass)</td>         
     </tr> 
    <tr>
        <td> 1</td>
        <td> 5</td>        
        <td> 193</td>        
        <td> -2 (exception) <pre>Exception raised: TypeError >> An error occurred running a Giac command:INPUT:sage2:=int(sage0,sageVARx):;OUTPUT:Warning, integration of abs or sign assumes constant sign by intervals (correct if the argument is real):Check [abs(t_ </pre> </td>
        <td> -2 (exception) <pre>Exception raised: TypeError >> An error occurred running a Giac command:INPUT:sage2:=int(sage0,sageVARx):;OUTPUT:Warning, integration of abs or sign assumes constant sign by intervals (correct if the argument is real):Check [abs(t_ </pre> </td>
     </tr>      
</table>
</body> 
</html>

这使

在此处输入图片描述

这正是我想要的。固定宽度的表格,并逐字换行。

2022 年 3 月 15 日更新

我发现给出的解决方案存在一个小问题。当添加\caption它不再起作用!

这是 MWE

\documentclass[12pt]{article}
\usepackage{longtable}
\usepackage{listings}
\lstset{
basicstyle=\footnotesize,
breaklines=true
}        

\begin{document}
       
\begin{longtable}[c]{|p{0.4in}|p{0.4in}|p{0.4in}|p{2.2in}|p{2.2in}|}\hline
\# &test file \#&integral \#&Giac 1.7.0 via sagemath 9.5&Giac 1.7.0 via sagemath 9.3 \\ \hline 
39&33&320&-2 (exception)
\begin{lstlisting}
Exception raised: TypeError >> An error occurred running a Giac command:INPUT:sage2:=int(sage0,sageVARx):;OUTPUT:Warning, integration of abs or sign assumes constant sign by intervals (correct if the argument is real):Check [abs(t_
\end{lstlisting}
& 1 (pass) \\ \hline
\end{longtable}    


\begin{longtable}[c]{|p{0.4in}|p{0.4in}|p{0.4in}|p{2.2in}|p{2.2in}|}\hline
\caption{Summary of regression test}\\
39&33&320&-2 (exception)
\begin{lstlisting}
Exception raised: TypeError >> An error occurred running a Giac command:INPUT:sage2:=int(sage0,sageVARx):;OUTPUT:Warning, integration of abs or sign assumes constant sign by intervals (correct if the argument is real):Check [abs(t_
\end{lstlisting}
& 1 (pass)\\ \hline
\end{longtable}    
                       
\end{document}

以上内容由

make4ht -a debug -c mycfg.cfg foo.tex "htm,mathjax,p-width"

mycfg.cfg 的位置

\Preamble{xhtml}
\Css{table .lstlisting{
  white-space: pre-wrap;
  word-break: break-all;
}}

\makeatletter
% use normal space in listings
\def\lst@outputspace{\HCode{ }}
\Css{.lstlisting .label{margin-right:0em; }}
\makeatother

\begin{document}
\EndPreamble

给出 HTML

在此处输入图片描述

上面的第二个表格由于添加而丢失了列宽,\caption 有没有解决方法?

2022 年 3 月 24 日更新

我发现建议的解决方案存在一个小问题。它在网页中生成的列表中添加了一个额外的换行符。输入中没有这个换行符。这似乎是由于使用white-space: pre-wrap;但这是强制换行以适应列宽的需要。

是否可以在不引入额外新行的情况下完成对列宽的换行?这是 MWE

\documentclass[12pt]{book}    
\usepackage{longtable}
\usepackage{listings}    
\lstset{
basicstyle=\ttfamily\small,
breaklines=true
}         
\begin{document}
\begin{tabular}[c]{|p{0.4in}|p{0.4in}|p{0.4in}|p{2.2in}|p{2.2in}|}\hline
1&66&203&-2 (exception)\newline
\begin{lstlisting}
Exception raised: RuntimeError >> ECL says: THROW: The catch RAT-ERR is undefined.
second line
  third line
\end{lstlisting}
& 1 (pass) \\\hline
\end{tabular}  
\end{document}

使用编译

make4ht  -ulm default -a debug -c ./nma_mathjax.cfg foo2.tex "mathjax,htm"

下面答案中给出的那个到底在哪里nma_mathjax.cfg? 再来一遍:

\Preamble{xhtml,p-width}

\Css{table .lstlisting{
  white-space: pre-wrap;
  word-break: break-all;
}}

\makeatletter
% use normal space in listings
\def\lst@outputspace{\HCode{ }}
\Css{.lstlisting .label{margin-right:0em; }}
\makeatother

\begin{document}
\EndPreamble

HTML 显示单独的行确实换行正确,但添加了新行:

在此处输入图片描述

答案1

编辑:

以下是包含 Listings 中最新更改的完整配置文件。它们仅在 TL 2022 中可用:

\Preamble{xhtml}

%%%%%%%%%%%%%%%%%%%%%%
%see https://tex.stackexchange.com/questions/637695/how-to-add-frame-and-background-color-with-listing-when-used-with-text4ht
%thanks to michal.h21

\makeatletter
\catcode`\:=11
\lst@AddToHook{Init}{%
\bgroup%
  % handle backround color and border in listings
  \ifx\lst@fillcolor\@empty\else%
    \lst@fillcolor%
    \extractcolorspec{.}\html@fillcolor%
    \expandafter\convertcolorspec\html@fillcolor{HTML}\html@fillcolor%
    \Css{\#listing-\listingN{background-color:\#\html@fillcolor;}}%
  \fi%
  \ifx\lst@rulecolor\@empty\else%
    \lst@rulecolor%
    \extractcolorspec{.}\html@rulecolor%
    \expandafter\convertcolorspec\html@rulecolor{HTML}\html@rulecolor%
    \Css{\#listing-\listingN{border: 1px solid \#\html@rulecolor;}}%
  \fi%
\egroup%
}

\ConfigureEnv{lstlisting}
   {\ifvmode \IgnorePar\fi \EndP
    \gHAdvance\listingN by 1
    \HCode{<!--l. \the\inputlineno-->}%
    \gdef\start:LstLn{%
       \HCode{<pre class="lstlisting" id="listing-\listingN">}%
       \gdef\start:LstLn{\HCode{\Hnewline}}}
    \bgroup%
    % we put the closing </div> here in order to support floating listings
    % https://tex.stackexchange.com/a/615703/2891
    \pend:def\lst@DeInit{\ifvmode\IgnorePar\fi\EndP\HCode{</pre>}}%
       \Configure{listings}
         {{\everypar{}\leavevmode}}
         {{\everypar{}\leavevmode}}
         {\start:LstLn \HCode{<span class="label">}}
         {\HCode{</span>}}%
   }
   {\egroup\par}
   {} {}
\Css{pre.lstlisting, pre.lstinputlisting{font-family: monospace,monospace; white-space: pre-wrap;
                    margin-top:0.5em; margin-bottom:0.5em;
                   }}


\Configure{lstinputlisting}
   {\ifvmode \IgnorePar\fi \EndP
    \HCode{<!--l. \the\inputlineno-->}%
    \gHAdvance\listingN by 1%
    \HCode{<pre class="lstinputlisting" id="listing-\listingN">}%
    \bgroup\ttfamily%\special{t4ht@(}%
       \Configure{listings}%
         {{\everypar{}\leavevmode}}%
         {{\everypar{}\leavevmode}}%
         {\HCode{\Hnewline<span class="label">}}%
         {\HCode{</span>}}%
   }
   {%\special{t4ht@)}
    \egroup%
    \ifvmode \IgnorePar\fi \EndP  \HCode{</pre>}\par}%
\Css{}
\makeatother
\catcode`\:=12
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%

%see https://tex.stackexchange.com/questions/634005/how-to-make-lstlisting-work-with-tex4ht-in-table-with-fixed-column-width
%to support listlisting in table so it wraps. added Feb 16, 2022

\Css{table .lstlisting{
  white-space: pre-wrap;
  word-break: break-all;
}}
\makeatletter
% use normal space in listings
\def\lst@outputspace{\HCode{ }}
\Css{.lstlisting .label{margin-right:0em; }}
\makeatother

\begin{document}
\EndPreamble

我发现 TeX4ht 在列表中使用了不间断空格,这可以防止换行。您还需要声明一些 CSS 以在列表中启用换行:

\Preamble{xhtml}
\Css{table .lstlisting{
  white-space: pre-wrap;
  word-break: break-all;
}}

\makeatletter
% use normal space in listings
\def\lst@outputspace{\HCode{ }}
\Css{.lstlisting .label{margin-right:0em; }}
\makeatother

\begin{document}
\EndPreamble

在此处输入图片描述

相关内容