用於DOM元素的頁邊空白不起作用

我試圖用margin-left創建一個動態P元素爲33px。但它不起作用。但是，當左邊沒有被使用（margin）和靜態的html p元素時，同樣的工作正常。爲什麼這樣？我已經嘗試過IE11和Chrome版本60.0.3112.113。用於DOM元素的頁邊空白不起作用

<!DOCTYPE html> 
<html> 
<head> 
    <title>Chat</title> 
    <meta charset="utf-8"> 
</head> 
<body> 
    <div id="screenv" style="border:1px solid black;margin: 5px;padding: 5px;width: 300px;height: 300px;"></div></br> 
    <input id="tb" type="text" style="border:1px solid black;margin: 5px;padding: 5px;width: 300px;" placeholder="Enter your text"></input> 
    <button onclick="submit()">Submit</button> 
    <p style="margin-left:33px;">hello</p>//css works fine 
    <script type="text/javascript"> 

     var you="",screen="",msg="",c_time="",val="",d,h,m,line; 
     function submit() { 

     val=document.getElementById("tb").value; 
     screen=document.getElementById('screenv'); 

     you=document.createElement("div"); 
     you.innerHTML="You:"; 

     screen.appendChild(you); 


     c_time=document.createElement("p"); 
     d = new Date(); 
     h = d.getHours(); 
     m = d.getMinutes(); 
     c_time.innerHTML = h+":"+m; 
     c_time.style.display="inline"; 
     c_time.style.color="grey"; 

     msg=document.createElement("p"); 
     msg.innerHTML=val; 
     msg.style.margin-left="33px";//not working 


     line=document.createElement("br"); 

     you.appendChild(c_time); 
     you.appendChild(line); 
     you.appendChild(msg); 
     document.getElementById("tb").value=""; 
    } 


    </script> 

</body> 
</html>

來源

2017-08-28 Nivetha

將'margin-left'更改爲'marginLeft'。 – Phil

_「爲什麼會這樣？」 - 因爲每個懶得學習語法基礎知識的人都知道''是減法運算符...... – CBroe

msg.style.margin-left="33px";將由解析器解釋爲as subtract operator。因此，所有帶有破折號的CSS屬性都在Javascript中以camelCase寫入。

來源

2017-08-28 10:27:56

用於DOM元素的頁邊空白不起作用

回答

相關問題