CMS'mizde bir editörümüz var. Son kullanıcılarımız bu editör aracılığıyla bazı uzun makaleler girecek. Bu makalelerdeki tirelerde satır kesilmesini önlemek için bir yola ihtiyacımız var.
Tüm tarayıcılarda tirelerde satır kesilmesini önlemek için herhangi bir yol var mı?
veya editörün bunu önleme seçeneği var mı?
Yanıtlar:
Korkarım bunu güvenilir bir şekilde yapmanın, metni "kelimelere" ayırmaktan (boşlukla ayrılmış beyaz boşluk olmayan karakter dizileri) ve nobrişaretlemenin içine tire içeren her "kelimeyi" kaydırmaktan daha basit bir yolu yoktur . Bu nedenle, giriş verileri bla bla foo-bar bla bladöndürülecek bla bla <nobr>foo-bar</nobr> bla bla.
Hatta nobr"kelime" harf ve rakamlardan başka bir şey içerdiğinde işaretleme eklemeyi bile düşünebilirsiniz . Bunun nedeni, bazı tarayıcıların "2/3" veya "f (0)" gibi dizeleri bile kırabilmesidir ( tarayıcılarda satır kırmanın tuhaflıkları hakkındaki sayfama bakın ).
nobrEtiketi, standart ve şiddetle W3C cesaretini değildir. Bkz. W3.org/TR/html5/obsolete.html#non-conforming-features
nobrişaretleme tüm tarayıcılarda çalışır, stil sayfaları devre dışı bırakıldığında bile çalışır ve özel karakterlere verilen destekten bağımsız olarak çalışır. Bir var mı gerçek onunla sorun?
‑Unicode KIRILMAYAN HİPHEN (U + 2011) olanı kullanabilirsiniz .
HTML: ‑veya‑
Ayrıca bkz .: http://en.wikipedia.org/wiki/Hyphen#In_computing
-ile ‑.
nobretiketlerin her yere yapıştırılmasından sonra pratikte pek işe yaramıyor. IE bunu bir çizgi olarak görüntüler, Safari, etrafına normal bir tireden daha fazla alan ekler ve çoğu metin düzenleyicisi bunu bir soru işareti veya kutusu veya başka anlamsız karakter olarak görüntüler.
white-space: nowrapönerdiği gibi giderdim. FF / Win7'de Btw, hedef uygulama Unicode uyumlu olsa bile, Firefox dışında kopyalanıp yapıştırıldığında utangaç çizgi normal bir kısa çizgiye dönüştürülmüş gibi görünüyor.
Çözümlerden biri, fazladan bir spanetiket ve white-spaceCSS özelliği kullanmak olabilir . Sadece şöyle bir sınıf tanımlayın:
.nowrap {
white-space: nowrap;
}Ve sonra, tireli metninizin etrafına bu sınıfla bir aralık ekleyin.
<p>This is the <span class="nowrap">anti-inflammable</span> model</p>Bu yaklaşım tüm tarayıcılarda gayet iyi çalışmalıdır - burada listelenen hatalı uygulamalar white-spacemülkün diğer değerleri içindir : http://reference.sitepoint.com/css/white-space#compatibilitysection
white-space: nowraptüm kapsayıcıya uygulayın. Aksi takdirde, bırak gitsin; birincisi, genel içerik için kısa çizgilerle satır sonlarını engellemenin bir nedeni yoktur ve ikincisi, CKEditor'u hacklemeye istekli değilseniz, aradığınız şeyin otomatik olarak gerçekleşmesini sağlamanın bir yolu yoktur.
<nobr>çok daha net.
Her HTML örneğini düzenlemeden bunu yapamazsınız. Sonuç olarak, onları değiştirmek için bazı JS yazdım:
jQuery:
//replace hypens with no-breaking ones
$txt = $("#block-views-video-block h2");
$txt.text( $txt.text().replace(/-/g, '‑') );Vanilya JS:
function nonBrHypens(id) {
var str = document.getElementById(id).innerHTML;
var txt = str.replace(/-/g, '‑');
document.getElementById(id).innerHTML = txt;
}Tire etrafında birleştirici karakteri ( ⁠) kullanın . IE'de de çalışıyor.
https://en.wikipedia.org/wiki/Word_joiner
belirli kısa çizgileri düzelt ...
function fixicecream(text) {
return text.replace(/ice-cream/g,'ice⁠-⁠cream'));
}veya her şey ...
function fixhyphens(text) {
return text.replace(/(\S+)-(\S+)/g,'$1⁠-⁠$2'));
}Bu CSS'yi deneyin:
word-break: break-all;
-webkit-hyphens:none;
-moz-hyphens: none;
hyphens: none;