为什么我在 <span> 元素后换行
Why do I get a line break after a <span> element
为什么我会换行?我使用以下内容: White-space: nowrap;但是当我填写跨度时,会出现换行符。这是什么原因造成的?
function insertLinkHoverImage(datei,datei2,verlinkung)
{
var doc = document.getElementById("frame").contentWindow.document;
var range = doc.getSelection().getRangeAt(0);
var nnode = doc.createElement("span");
var width = 0;
var height = 0;
var image = doc.createElement("img");
image.src = "http://www.galliano.cc/Test_seite/cms/uploads/"+datei;
//Wenn Bild hochgeladen wurde
image.onload = function() {
document.getElementById("imgwidth").value = image.width;
document.getElementById("imgheight").value = image.height;
var alink = doc.createElement("a");
var classDatei2 = "";
alink.href = verlinkung;
classDatei2 = datei.replace(".","-");
nnode.setAttribute("style","white-space: nowrap; background-image:url(http://www.galliano.cc/Test_seite/cms/uploads/"+datei+"); width:"+document.getElementById("imgwidth").value+"px; height: "+document.getElementById("imgheight").value+"px; display: block; background-repeat: no-repeat;");
alink.appendChild(nnode);
range.insertNode(alink);
}
}
如果您查看 JavaScript,您有:
var nnode = doc.createElement("span");
然后你有:
nnode.setAttribute("style","white-space: nowrap;
background-image:url(...);
width:"+document.getElementById("imgwidth").value+"px;
height: "+document.getElementById("imgheight").value+"px;
display: block; background-repeat: no-repeat;");
所以 span
默认情况下是一个内联元素,但是你在你的内联样式中指定 display: block
,这使它成为一个块级元素,这会给你换行符.
尝试使用 display: inline-block
。
为什么我会换行?我使用以下内容: White-space: nowrap;但是当我填写跨度时,会出现换行符。这是什么原因造成的?
function insertLinkHoverImage(datei,datei2,verlinkung)
{
var doc = document.getElementById("frame").contentWindow.document;
var range = doc.getSelection().getRangeAt(0);
var nnode = doc.createElement("span");
var width = 0;
var height = 0;
var image = doc.createElement("img");
image.src = "http://www.galliano.cc/Test_seite/cms/uploads/"+datei;
//Wenn Bild hochgeladen wurde
image.onload = function() {
document.getElementById("imgwidth").value = image.width;
document.getElementById("imgheight").value = image.height;
var alink = doc.createElement("a");
var classDatei2 = "";
alink.href = verlinkung;
classDatei2 = datei.replace(".","-");
nnode.setAttribute("style","white-space: nowrap; background-image:url(http://www.galliano.cc/Test_seite/cms/uploads/"+datei+"); width:"+document.getElementById("imgwidth").value+"px; height: "+document.getElementById("imgheight").value+"px; display: block; background-repeat: no-repeat;");
alink.appendChild(nnode);
range.insertNode(alink);
}
}
如果您查看 JavaScript,您有:
var nnode = doc.createElement("span");
然后你有:
nnode.setAttribute("style","white-space: nowrap;
background-image:url(...);
width:"+document.getElementById("imgwidth").value+"px;
height: "+document.getElementById("imgheight").value+"px;
display: block; background-repeat: no-repeat;");
所以 span
默认情况下是一个内联元素,但是你在你的内联样式中指定 display: block
,这使它成为一个块级元素,这会给你换行符.
尝试使用 display: inline-block
。