Freunde, die das SyntaxHighlighter-Syntaxhervorhebungs-Plugin verwenden, sind möglicherweise auf das Problem der Codeanzeige ohne Zeilenumbrüche gestoßen. Es hat mich schon lange gestört Die Lösung ist eigentlich einfach, lasst uns darüber reden...
Lösung:
Öffnen Sie die Datei shCoreDefault.css, suchen Sie die Definition des Textbereichs .syntaxhighlighter und fügen Sie am Ende den Satz hinzu: word-break:break-all !important; und es ist in Ordnung, was bedeutet, dass der Code zum Umbruch gezwungen wird Anzeige.
Da jeder ein anderes CSS aufruft, können Sie das CSS entsprechend Ihren eigenen Bedürfnissen ändern
Der Test ergab, dass es für Version 3.08 ungültig ist. Sie können sich auf die folgende Methode beziehen
Da es in meinem Blog hauptsächlich um Code-Sharing geht, sind viele der geposteten Codes sehr lang. Oft muss ich es manuell einpacken.
Aber ich kann es heute einfach nicht ertragen. Finden Sie online eine Lösung.
1. CSS-Änderung:
Im Ordner: zb_systemADMINueditorthird-partySyntaxHighlighter
CSS in der Datei shCoreDefault.pack.css hinzufügen:
body .syntaxhighlighter .line{ white-space: pre-wrap !important; } .syntaxhighlighter{ width:100%!important;margin:.3em 0 .3em 0!important;position:relative!important;overflow:auto!important;background-color:#f5f5f5!important;border:1px solid #ccc!important;word-break:break-all; }
2. JQuery-Code:
$(function () { // Line wrap back var shLineWrap = function () { $('.syntaxhighlighter').each(function () { // Fetch var $sh = $(this), $gutter = $sh.find('td.gutter'), $code = $sh.find('td.code') ; // Cycle through lines $gutter.children('.line').each(function (i) { // Fetch var $gutterLine = $(this), $codeLine = $code.find('.line:nth-child(' + (i + 1) + ')') ; //alert($gutterLine); // Fetch height var height = $codeLine.height() || 0; if (!height) { height = 'auto'; } else { height = height += 'px'; //alert(height); } // Copy height over $gutterLine.attr('style', 'height: ' + height + ' !important'); // fix by Edi, for JQuery 1.7+ under Firefox 15.0 console.debug($gutterLine.height(), height, $gutterLine.text(), $codeLine); }); }); }; // Line wrap back when syntax highlighter has done it's stuff var shLineWrapWhenReady = function () { if ($('.syntaxhighlighter').length === 0) { setTimeout(shLineWrapWhenReady, 10); } else { shLineWrap(); } }; // Fire shLineWrapWhenReady();});
Der obige Code ist ein Langcode. Mal sehen, ob jeder seinen Beruf gewechselt hat? ?
Jetzt stimmt die Höhe der Zeilennummer mit der Höhe des Codes überein.