tex4ht 中的 listings 包。如何防止 listing 代码换行过长

2024-5-26 • tag-icon

tex4ht 中的 listings 包。如何防止 listing 代码换行过长

此问题仅适用于 tex4ht。

当前问题概述

我想使用 say 来缩小 HTML 页面的宽度（以便于阅读）max-width:700px;，但同时，我不希望列表生成的逐字代码环绕。

即我希望 HTML 看起来像 PDF，其中代码完全不受页面宽度的影响。我知道max-width从正文中删除可以解决这个问题。但我正在寻找一个可以保留这个但不影响列表的解决方案。否则，我不得不回到使用逐字逐句在 HTML 中列出代码，这是一个大问题，因为这意味着我必须复制每个代码片段。一次用于 HTML，一次用于 PDF。

有没有办法让列表不受max-width:720px;body 中设置的影响？当我max-width:720px;从 body 中删除并将其添加到 ponly 时，它不起作用，并且它再次使整个页面变宽。

\documentclass[12pt,titlepage]{article}
\usepackage{listings,lstautogobble}% added lstautogobble oct 30,2020
\lstdefinestyle{TEXT}{%
    basicstyle=\ttfamily\normalsize,
    breaklines=false,
    %columns=fullflexible,
    keepspaces=true,
    language=,
    frame=single,
    frameround=tttt,
    aboveskip=12pt,belowskip=6pt
}
\lstnewenvironment{TEXTinline}{%
  \lstset{style=TEXT}}{}

\begin{document} 
\ifdefined\HCode
\Css{body{
      margin: 0 auto; 
      margin-top: 1em; 
      margin-bottom: 1em; 
      font-family: arial, sans-serif;
      line-height: 1.5;
      font-style: normal;
      font-size: 18px;
      border: 1px solid;
      max-width:720px;
      }}

\Css{p{text-align:justify;}}

\fi 

long text long text  long text  long text  long text  long text  long text  long text  long text  long text  long text  long text  long text  long text 
long text  long text  long text  long text  long text 

This is using verbatim
\begin{verbatim}  
restart;

expr:= y(x)*diff(y(x),x)^(1/3)+sin(x)*diff(y(x),x)^3 + z*diff(y(x),x)*ln(y(x)*diff(y(x),x)^2) +diff(y(x),x)^(1/2) + x/diff(y(x),x)^7;
t1:=identical(diff(y(x),x))^anything;
t2:=identical(diff(y(x),x));
indets[flat](expr, 'Or'(  t1, t2 ));
\end{verbatim}  

This is using listings

\begin{TEXTinline}  
restart;

expr:= y(x)*diff(y(x),x)^(1/3)+sin(x)*diff(y(x),x)^3 + z*diff(y(x),x)*ln(y(x)*diff(y(x),x)^2) +diff(y(x),x)^(1/2) + x/diff(y(x),x)^7;
t1:=identical(diff(y(x),x))^anything;
t2:=identical(diff(y(x),x));
indets[flat](expr, 'Or'(  t1, t2 ));
\end{TEXTinline} 
\end{document}

输出为

 make4ht -ulm default foo.tex "mathjax,htm,nostyle"

我尝试过

我尝试white-space: nowrap;在 HTML 中生成的每个列表元素中添加内容。以下是上述代码的原始 HTML

<!DOCTYPE html> 
<html lang='en-US' xml:lang='en-US'> 
<head><title></title> 
<meta charset='utf-8' /> 
<meta content='TeX4ht (https://tug.org/tex4ht/)' name='generator' /> 
<meta content='width=device-width,initial-scale=1' name='viewport' /> 
<link href='foo.css' rel='stylesheet' type='text/css' /> 
<meta content='foo.tex' name='src' /> 
<script>window.MathJax = { tex: { tags: "ams", }, }; </script> 
 <script async='async' id='MathJax-script' src='https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-chtml-full.js' type='text/javascript'></script>  
</head><body>
<!-- l. 34 --><p class='noindent'>long text long text long text long text long text long text long text long text long
text long text long text long text long text long text long text long text long text
long text long text
</p><!-- l. 37 --><p class='indent'>   This is using verbatim
                                                                                                                                                            
</p>   
<pre class='verbatim' id='verbatim-1'>
    restart;

    expr:= y(x)*diff(y(x),x)^(1/3)+sin(x)*diff(y(x),x)^3 + z*diff(y(x),x)*ln(y(x)*diff(y(x),x)^2) +diff(y(x),x)^(1/2) + x/diff(y(x),x)^7;
    t1:=identical(diff(y(x),x))^anything;
    t2:=identical(diff(y(x),x));
    indets[flat](expr, ’Or’(  t1, t2 ));
    
</pre>
<!-- l. 45 --><p class='nopar'>
</p><!-- l. 47 --><p class='indent'>   This is using listings
</p>   
<!-- l. 49 --><pre class='listings' id='listing-1'><span class='label'><a id='x1-2r1'></a></span><span style='color:#000000'>    <span class='ec-lmtt-12'>restart;</span> 
</span><span class='label'><a id='x1-3r2'></a></span> 
<span class='label'><a id='x1-4r3'></a></span><span style='color:#000000'>    <span class='ec-lmtt-12'>expr:= </span><span class='ec-lmtt-12'>y(x)*diff(y(x),x)^(1/3)+sin(x)*diff(y(x),x)^3 </span><span class='ec-lmtt-12'>+ </span><span class='ec-lmtt-12'>z*diff(y(x),x)*ln(y(x)*diff(y(x),x)^2) </span><span class='ec-lmtt-12'>+diff(y(x),x)^(1/2) </span><span class='ec-lmtt-12'>+ </span><span class='ec-lmtt-12'>x/diff(y(x),x)^7;</span> 
</span><span class='label'><a id='x1-5r4'></a></span><span style='color:#000000'>    <span class='ec-lmtt-12'>t1:=identical(diff(y(x),x))^anything;</span> 
</span><span class='label'><a id='x1-6r5'></a></span><span style='color:#000000'>    <span class='ec-lmtt-12'>t2:=identical(diff(y(x),x));</span> 
</span><span class='label'><a id='x1-7r6'></a></span><span style='color:#000000'>    <span class='ec-lmtt-12'>indets[flat](expr, </span><span class='ec-lmtt-12'>’Or’( </span> <span class='ec-lmtt-12'>t1, </span><span class='ec-lmtt-12'>t2 </span><span class='ec-lmtt-12'>));</span> 
</span><span class='label'><a id='x1-8r7'></a></span><span style='color:#000000'>    
 
</span><span class='label'><a id='x1-9r8'></a></span></pre>
    
</body> 
</html>

我从上面看到了，它是pre class='listings' 这样改变的

 <pre class='listings' id='listing-1'  style="white-space: nowrap;">

但现在这让所有行都变成了一行！这不是我想要的。我希望代码能够完全按照上面的逐字逐句显示，但使用列表。

我有一个解决方案，使用逐字处理 tex4ht，使用列表处理 pdf。这个解决方案的问题是，我必须为每个列表制作新的副本，从而重复很多代码。原因是，我无法创建一个宏/新命令，该命令在 Latex 中逐字处理。感谢Verbatimegreg 的帮助，可以做到这一点如何使用现有环境创建新环境？扫描使用 \FancyVerbGetLine 时文件结束

，但不适合verbatim。

问题是Verbatim仍然会换行，就像列表一样。因此，使用上述问题评论中 egreg 的技巧来使verbatim命令工作不起作用，因为它改回了Verbatim不会换行长行。

问题又来了：有没有办法让列表在 tex4ht 生成的 HTML 中不换行？就像在 PDF 中一样。

当然，任何 CSS 解决方案都可以。我会继续寻找其他 CSS 可能性来尝试。

如果 Latex 允许创建新命令并verbatim在其中包含从外部接收参数的命令，那么所有这些都可以轻松解决。但这是不可能的。

答案1

相反white-space: nowrap;，你可以查看其他可能性https://developer.mozilla.org/en-US/docs/Web/CSS/white-space。似乎nowrap会折叠连续的空格并且不会中断任何行，而这两者都不是您想要的。相反，您希望保留列表的空格，并且只在 html 源代码中出现断行时才中断行。这似乎是的行为white-space: pre;。

答案2

一般来说，您不希望出现无法在屏幕上显示的长行。这在显示屏较小的设备（如移动电话）上可能会出现问题。这就是我们将过长的行打断的原因。这应该不是什么大问题，因为当您将该代码复制到文本编辑器中时，它应该可以正确复制。如果您真的不想打断它，您可以使用 CSS 属性 overflow: auto，它将为比当前视图更宽的文本显示滚动条。以下配置将为和启用此verbatim功能listings：

\Preamble{xhtml}
\Css{pre.listings, pre.lstinputlisting, pre.verbatim {white-space: pre;overflow:auto;}}
\begin{document}
\EndPreamble

结果如下：

当前问题概述

我尝试过

答案1

答案2

相关内容