divのテキストの整列をドロップダウン選択から変更しますか？

divのフォントをスタイルするためのドロップダウンリストがいくつかあります。しかし、私はうまく動作するように整列を得るように見える。助けてください！！私はいつもグーグルで私の答えを見つけたし、ラフなものを得るのに苦労することはなかった。アライメントは本当に私を悩ませている、私は解決策を見つけることができません。divのテキストの整列をドロップダウン選択から変更しますか？

<SCRIPT LANGUAGE="JavaScript"> 

function fontSize(size){ 
document.getElementById("lineOne").style.fontSize = size 
} 

function fontFamily(family) { 
document.getElementById("lineOne").style.fontFamily = family 
} 

function fontStyle(style) { 
document.getElementById("lineOne").style.fontStyle = style 
} 

function fontWeight(weight) { 
document.getElementById("lineOne").style.fontWeight = weight 
} 

function addContent(divName, content) { 
document.getElementById(divName).innerHTML = content; 
} 

function setColor() {  
var color = document.getElementById("color").value;  
document.getElementById("myDiv").style.color = color; 
} 

function alignl(ele){  
document.getElementById("lineOne").style.align = ele 
} 

</SCRIPT>

と体がAAようになっている：

<body> 

Size: 
    <select name=fontSizeChanger onchange="fontSize(this.value)"> 
     <option value="6">6</option> 
     <option value="8">8</option> 
     <option value="10">10</option> 
     <option value="12" selected="selected">12</option> 
     <option value="14">14</option> 
     <option value="16">16</option> 
     <option value="18">18</option> 
     <option value="20">20</option> 
    </select> 

    Colour: 
    <select id="color" onclick="setColor();"> 
     <option value="white">white</option>   
     <optionvalue="black"selected="selected">black</option>   
     <option value="red">red</option>   
     <option value="lightblue">light blue</option>   
     <option value="darkblue">dark blue</option>   
     <option value="lightgreen">light green</option>   
     <option value="darkgreen">dark green</option>   
     <option value="yellow">yellow</option>   
     <option value="orange">orange</option>   
     <option value="pink">pink</option>   
     <option value="purple">purple</option>   
     <option value="gray">gray</option>   
    </select> 

    Family: 
    <select id="fontFamilyChanger" onchange="fontFamily(this.value)"> 
<option value="sans-serif" selected="selected">Sans Serif</option>   
     <option value="Impact">Impact</option>   
    <option value="times new roman">Times New Roman</option>    
    </select>  

    Style: 
    <select id="fontStyleChanger" onchange="fontStyle(this.value)"> 
    <option value="normal" selected="selected">Normal</option>   
     <option value="italic">Italic</option>   
     <option value="oblique">Oblique</option>    
    </select> 

    Weight: 
    <select id="fontWeightChanger" onchange="fontWeight(this.value)"> 
    <option value="normal" selected="selected">Normal</option>   
    <option value="bold">Bold</option>      
    </select> 

    Align: 
    <select id='s' name='s' onchange="alignl(this.value);"> 
     <option value="left">left</option> 
     <option value="right">right</option> 
     <option value="center">center</option> 
     <option value="top">top</option> 
    </select> 

    <form name="myForm"> 
     <input name="myContent"></input> 
     <input type="button" value="Add content" onClick="addContent('lineOne', document.myForm.myContent.value); setCookie('content', document.myForm.myContent.value, 7);"> 
    </form> 

    <div id="myDiv"> 
     <div id="lineOne"></div> 
    </div> 

</body>

出典

2012-02-02 Shauni Daniels

あなたはalign、ないあなたが他のスタイリングのプロパティを設定するのと同じ方法で整列を設定することができますが、変数はtextAlignという名前です。

function alignl(style) { 
    document.getElementById("lineOne").style.textAlign = style; 
}

出典

2012-02-02 09:27:54

ありがとうございました。最も簡単な答えは常に解決するのが最も難しいです。とにかく私の場合。 –

リストに入力ボックスを追加して別にスタイルを設定したいと思います。どのようにこれが行われますか。私は、前の行とは違ったスタイルのdivで、別の行のテキストが必要です。 –

divのテキストの整列をドロップダウン選択から変更しますか？

答えて

関連する問題