如何使按鈕切換的文本顯示在按鈕旁邊，而不是出現在新行上？

Question

這是我的代碼

<script type="text/javascript">

function toggle(obj) {
      var obj=document.getElementById(obj);
      if (obj.style.display == "block") obj.style.display = "none";
      else obj.style.display = "block";
}

<body>

<button type="button" style="width: 150px; height: 50px;"
onClick="toggle('miniDisplay')"> minicom </button>
<div id="miniDisplay" style="display:none;">

<p style="text-align:center;">connect to minicom and display</p></div>
</body>

當前，文本在按鈕所在的位置下方顯示一行。 我希望它顯示在同一行上。 我知道它是居中對齊的，它位於另一行按鈕的下方。

Answer 1

在您的JavaScript中將“阻止”更改為“內聯阻止”。

Answer 2

您的div是一個塊級元素，這意味着它將擴展以占據其容器的整個寬度。 改為將其更改為inline-block。

function toggle(obj) {
      var obj=document.getElementById(obj);
      if (obj.style.display == "inline-block") obj.style.display = "none";
      else obj.style.display = "inline-block";
}

jsFiddle示例

如何使按鈕切換的文本顯示在按鈕旁邊，而不是出現在新行上？

問題描述

2 個解決方案

解決方案1
0

解決方案2
0 已采納 2014-03-19 14:03:59

如何使按鈕切換的文本顯示在按鈕旁邊，而不是出現在新行上？

問題描述

2 個解決方案

解決方案1 0

解決方案2 0 已采納 2014-03-19 14:03:59

解決方案1
0

解決方案2
0 已采納 2014-03-19 14:03:59