0

私がやろうとしているのは、ブログ投稿のタイトルをブログの説明のちょうど半分の幅にし、ブログの説明の幅の 50% に揃えることです。

これは私がJSで試したものです:

var post_title_width = document.getElementById("post_desciption").offsetWidth;

var post_title_width = post_description * 0.5; document.getElementbyId("post_title").style.width = post_title_width;

HTML:

    <div class="post">
    <span class="post_title">This is a test title, testing some javascript...........</span><br>
    <span class="post_description">Hello this is a test description right here, just to test some code im trying to do</span>   
    </div>

JavaScript をテストして効率的に使用する方法を学びたいので、CSS は使用していません。

4

2 に答える 2

0

本当にJavaScriptでやりたいのなら、いくつかの問題があります：

  1. getElementbyId でクラス名をターゲットにしようとしています
  2. 変数名がめちゃくちゃです
  3. スパンはブロック要素ではないため、オーバーフローを設定して表示をブロックまたはインラインブロックに変更しない限り、幅の設定は適用されません

http://jsfiddle.net/cmweU/

var post_description = document.getElementsByClassName("post_description")[0],
    post_description_width = post_description.offsetWidth,
    post_title_width = ( post_description_width * 0.5 ) + "px"; 

document.getElementsByClassName("post_title")[0].style.width = post_title_width;
于 2013-08-01T21:18:57.067 に答える
0

これを試してください（例）：

HTML

<div id="head"><div id="half"></div></div>

CSS

#head {
    width: 300px;
    height: 100px;
    background: purple;
}
#half {
    height: 100%;
    background: green;
}

JS

document.getElementById("half").style.width = document.getElementById("head").offsetWidth / 2 + 'px';

カウンタの中心にあるマージン内部ブロックの JS は、これを使用してみてください (例):

document.getElementById("half").style.marginLeft = (document.getElementById("head").offsetWidth - document.getElementById("half").offsetWidth) / 2 + 'px';
于 2013-08-01T20:47:44.513 に答える