格式正确的源代码 [英] Nicely formatted source code

问题描述

源代码已使用换行符和空格进行格式化。

The source code is already formatted using newline characters and whitespace.

目标：

1. 保持源格式，只要线条在屏幕上水平放置（例如，pre）
   
   
   
   
   • 在左侧显示行号
   
   
   • 当线条不适合屏幕时，将线条划分为多行（例如，使用空格：预包装）
   
   
   • 从不合并空格或换行符（例如，前面那样）
   
   
   • 对于打破行号多次或仅在顶部一次的行（例如，每行使用背景图片，但我需要使用背景图片）的线条，对齐线条数顶部）
   
   
   • 前元素分开）
   
   
   • 允许使用鼠标选择和复制/粘贴几行，而不包括行号（例如
   
   从服务器端输出HTML和CSS，但最好没有JavaScript
   

1. keep source formatting as long as lines fit in the screen horizontally (e.g. pre)
   • show line numbers on the left side aligned with the lines (e.g. a table with line numbers in a separate column)
   • break lines into multiple lines when they do not fit in the screen (e.g. doable with white-space: pre-wrap)
   • never merge whitespace or newline characters (e.g. pre does that)
   • for lines that break either show the line number multiple times or just once at the top (e.g. align the line numbers top)
   • for lines that break show a small marker image at the end and/or at the beginning (e.g. use background image per line, but for that I need to make the pre elements separate)
   • allow selecting and copy/pasting a couple of lines with the mouse without including the line numbers (e.g. a single pre gives this, but otherwise this seems to be impossible)
   • outputting HTML and CSS from the server-side, but preferrably without JavaScript

我无法支持上述所有点，似乎不可能。我尝试使用div，table，pre在各种组合，与白空间：pre-wrap 等等，但没有运气有所有的选项。

I can't make it supporting all the above points, seems like it's impossible. I tried using div, table, pre in various combinations, with white-space: pre-wrap and so on, but had no luck having all the options.

一个简单的解决方案是什么？

What's a simple solution?

推荐答案

Opera不会复制行号，但我认为其他浏览器可能。

An ordered list does a decent job. Opera doesn't copy the line numbers with it, but I think other browsers might do.

这篇关于格式正确的源代码的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！