2016-01-08 29 views
6

Tarayıcı penceresinin genişliğinden daha uzun olduklarında satırların kesilmesine izin vermek için white-space: pre-wrap stilini stilinde kullanıyorum. Ne yazık ki bu kırık çizgiler de 'un sonunda bir satır sonu varmış gibi görünüyor; Kullanıcı otomatik bir satır sonu olup olmadığını göremez., beyaz boşlukta otomatik satır kesmeyi gösterir: ön sarma elemanı

((emacs'dan gibi bir \ karakteri ile yapar), ya da bir önceki satırın devamı olan sarılmış hatların başında ya sarma oluyor satırın sonunda göstermek için bir yolu var mı mesela ile)?

Kopyalama & yapıştırma devam karakterlerini kopyalamamalıdır.


Example code

:

<pre style="white-space: pre-wrap">for i in range(19): selwidth=5; selheight=1000; image = gimp.image_list()[0];posx=initx+i*90; pdb.gimp_image_select_polygon(image, 2, 8, [posx, 0, posx+selwidth, 0, posx+selwidth-selheight, selheight, posx-selheight, selheight]);</pre > 

Tercih render, devamı hatlarının başında ile:

for i in range(19): selwidth=5; selheight=1000; image = gimp.image_list()[0];posx= 
→initx+i*90; pdb.gimp_image_select_polygon(image, 2, 8, [posx, 0, posx+selwidth, 0, 
→posx+selwidth-selheight, selheight, posx-selheight, selheight]); 
+1

metin kaydırma tarafından oluşturulan satır aralıklarında semboller eklenemez, ancak ekleyebilir '→' https://jsfiddle.net/rv5d5omL/3/ veya https: // jsfiddle.net/rv5d5omL/4/her satırda '\ n' –

+0

Bu ^^. Ve hakkında * ".. kopyalama ve yapıştırma devam karakterleri kopyalamamalı ..." * - @ Mi-Yaratıcılık - https://jsfiddle.net/abhitalks/e9v8audb/ tarafından verilen kod bir varyasyonu kullanabilirsiniz - Bu, kopyalama-yapıştırma sırasında karakterleri içermez ve ayrıca programlı olarak textContent 'bunları içermez, temiz tutar. – Abhitalks

+0

bu aynı @Abhitalks keman ile ama "geri dönüş" ok sembolü ve son sembolü ile kaldırıldı https://jsfiddle.net/e9v8audb/4/ –

cevap

2

Öncesi o yazdığınız gibi metin tutmak için tasarlanmıştır. Şiirleri ve özel metinleri, tarayıcı tarafından görülmesi ve biçimlendirilmemesi amaçlandığı gibi tutmaya yardımcı oldu. Çoğu insanın bir metin satırının Pre ile sarılmış bir boşluk olduğunu söyleyebildiğini düşünürdüm: ön sargı çünkü böyle bir şeye benziyordu: yatağına beş küçük maymun atlama, {{line break}} Biri düştü ve kafasını çarptı. {{Satır sonu}} Mama Doktor ve denir Doktor söyledi , {{satır sonu}} "yatakta!' Atlama Artık maymunlar. Eğer düz ile giderse {{satır sonu}}

Eğer örnekte yazdığınız ve <pre> boşluk ile olduğu gibi görüneceğini HTML <p>. Eğer yazdığınız gibi pre-wrap alanı görünecektir

bir <span> koyarak deneyebilirsiniz her satırın uçlarını renklendirmek ve vermek CSS'ye renk ve boyut veya CSS arka plan rengini veren tüm cümlede bir <span> yapın.

+0

Özür dilerim, kaynak kod hakkında konuştuğumu netleştirmedim. Örneği güncelledim. – cweiske

2

AFAIK CSS ile değil, her yeni satırı 2 yeni satırla değiştirebilir, böylece metin sararken satırsonları ayırt edersiniz, bunu yapmak için el ile iki tane - veya daha fazla - satır sonu <br> s her yeni satır için veya her bir satır; ile sona erdiği, söz sağlanan örnek kod çünkü - - daha sonra her bir noktalı virgül ; yerine javaScript kullanmak ;\n\n ile değiştirin - veya ;<br><br> yerine ile - bu nedenle kabul edecektir.

JS Fiddle

var pre = document.getElementsByTagName('pre')[0], 
 
    preHTML = pre.innerHTML; 
 

 
pre.innerHTML = preHTML.replace(/;\s*/g, ";\n\n");
<pre style="white-space: pre-wrap">for i in range(19): selwidth=5; selheight=1000; image = gimp.image_list()[0];posx=initx+i*90; pdb.gimp_image_select_polygon(image, 2, 8, [posx, 0, posx+selwidth, 0, posx+selwidth-selheight, selheight, posx-selheight, selheight]);</pre >

+0

Ardından, normal satır sonları olan kaynak kodu aniden çift yükseklik, istediğim gibi değil. – cweiske