javascript - CSS 显示 : inline not working

Question

我试图以水平方式显示“headeri”的每个元素，如果有任何帮助，我已经将 js 附加到它。我尝试使用标签和 img 标签(依次是两者)将类和 ID 名称(依次是两者)添加到 css 文件中，但无济于事。

var loaded = false;
function loadImages(){}
function react(img, plain){}

function loadImages()
{
img1plain = new Image(0,0);
img1plain.src = 'plain1.gif';
img1over = new Image(0,0);
img1over.src  = 'over1.gif';

img2plain = new Image(0,0);
img2plain.src = 'plain2.gif';
img2over = new Image(0,0);
img2over.src  = 'over2.gif';

img3plain = new Image(0,0);
img3plain.src = 'plain3.gif';
img3over = new Image(0,0);
img3over.src  = 'over3.gif';

loaded = true;
}

function react(img, plain)
{
	if (loaded)
		{
		if (plain) document[img].src = eval(img + "plain.src");
		else document[img].src = eval(img + "over.src");
		}
}

.headeri{
	
	display: inline-block;
}

<header>
	<A HREF="#top" class="headeri" onMouseOver="react('img1', false);return true" onMouseOut="react('img1', true);return true"><IMG SRC="plain1.gif" NAME="img1" WIDTH=150 HEIGHT=25 BORDER=0></A><BR>
	<A HREF="#top" class="headeri"onMouseOver="react('img2', false);return true" onMouseOut="react('img2', true);return true"><IMG SRC="plain2.gif" NAME="img2" WIDTH=150 HEIGHT=25 BORDER=0></A><BR>
	<A HREF="#top" class="headeri"onMouseOver="react('img3', false);return true" onMouseOut="react('img3', true);return true"><IMG SRC="plain3.gif" NAME="img3" WIDTH=150 HEIGHT=25 BORDER=0></A><BR>
</header>

Answer 1

删除 <BR>标记

var loaded = false;
function loadImages(){}
function react(img, plain){}

function loadImages()
{
img1plain = new Image(0,0);
img1plain.src = 'plain1.gif';
img1over = new Image(0,0);
img1over.src  = 'over1.gif';

img2plain = new Image(0,0);
img2plain.src = 'plain2.gif';
img2over = new Image(0,0);
img2over.src  = 'over2.gif';

img3plain = new Image(0,0);
img3plain.src = 'plain3.gif';
img3over = new Image(0,0);
img3over.src  = 'over3.gif';

loaded = true;
}

function react(img, plain)
{
	if (loaded)
		{
		if (plain) document[img].src = eval(img + "plain.src");
		else document[img].src = eval(img + "over.src");
		}
}

.headeri{
	
	display: inline-block;
}

<header>
	<A HREF="#top" class="headeri" onMouseOver="react('img1', false);return true" onMouseOut="react('img1', true);return true"><IMG SRC="plain1.gif" NAME="img1" WIDTH=150 HEIGHT=25 BORDER=0></A>
	<A HREF="#top" class="headeri"onMouseOver="react('img2', false);return true" onMouseOut="react('img2', true);return true"><IMG SRC="plain2.gif" NAME="img2" WIDTH=150 HEIGHT=25 BORDER=0></A>
	<A HREF="#top" class="headeri"onMouseOver="react('img3', false);return true" onMouseOut="react('img3', true);return true"><IMG SRC="plain3.gif" NAME="img3" WIDTH=150 HEIGHT=25 BORDER=0></A>
</header>