1

段落要素をボタン要素のグループに揃えるのに問題があります。私はこれを試みるためにjQueryとCSSを使用しています。

これが私が見るものです：

ここに画像の説明を入力してください

そして理想的には、私がそうであるようにピクセルの領域を無駄にしないように、それらすべてを画面の上部の同じ水平線上に配置することを望みます。したがって、DesignNameテキストを作成し、そのすぐ右側にボタンを配置します。

要素がコードに追加される方法は次のとおりです。

var theDiv = $("#theDiv");

theDiv.append('<div id="buttonMenuDiv"></div>');

var buttonDiv = $("#buttonMenuDiv");
buttonDiv.append('<p id="DesignName" class="DesignName">DesignName</p>');
buttonDiv.append('<input type="button" id="MainMenu" value="Main Menu" >');
buttonDiv.append('<input type="button" id="NewModule" value="New Module" >');
buttonDiv.append('<input type="button" id="SearchDesigns" value="Search Designs" >');
buttonDiv.append('<input type="button" id="DesignDescription" value="Design Description" >');
buttonDiv.append('<input type="button" id="SaveWork" value="Save Work" >');
buttonDiv.append('<input type="button" id="PackageDesign" value="Package Design" >');
buttonDiv.append('<input type="button" id="Tutorial" value="Tutorial" >');

「DesignName」クラスはフォント属性（サイズ、色）を指定するだけなので、含めませんでした。助けてくれてありがとう。

（append（）呼び出しの単一引用符で編集上の問題があります）

4

3 に答える 3

3 
#theDiv * {
display:inline;
}

ブロックではなく、要素をインラインにするだけです。

http://jsfiddle.net/v5eYt/3/

于 2012-09-10T03:07:21.517 に答える
1

段落とdivはブロックタイプです。つまり、自動的に改行が続きます。入力はそうではなく、「デザイン名」の後にブレークを付けたくない場合は、おそらくそれをスパンに入れる必要があります（スパンはインライン要素と見なされ、テキストの流れを結合します）。上記のコメントで述べたようにフローティングも機能しますが、手荷物が少し増えます-同じ行にたくさんの単純なアイテムを保持しようとしている場合は、インライン要素（または「display：inline」を設定します） css）。

于 2012-09-10T03:07:42.673 に答える
1

これらのボタンに css ルールを使用して、これを実装できます。

/*css rule*/

#buttonMenuDiv > input{
   display: inline-block;
}

表示をインラインまたはインラインブロックに設定できます。ただし、それらをインラインに設定すると、「幅」および「高さ」属性は有効になりません。

于 2012-09-10T03:17:17.547 に答える