從下拉選擇更改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

您可以設置在相同的方式，設置其他樣式屬性對齊，但變量命名爲textAlign，不align。

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

來源

2012-02-02 09:27:54

非常感謝。最簡單的答案總是最難解決的。無論如何，在我的情況。 – 2012-02-02 09:35:07

我想添加更多的輸入框到列表中並單獨設置它的樣式。這將如何完成。我需要在不同於上一行的div中使用不同的文本行。 – 2012-02-02 09:36:28

從下拉選擇更改div的文本對齊？

回答

相關問題