JS style.marginLeft＆marginRight ='auto'not working

Question

使用Yahoo Weather API。

當試圖通過JS設置樣式邊距時，沒有任何反應。

這裏是我的腳本：

<script> 
var cBackFunction = function (data) { 
    console.log(data); 

    var location = data.query.results.channel.location; 
    var condition = data.query.results.channel.item.condition; 
    var wind = data.query.results.channel.wind; 
    var units = data.query.results.channel.units; 
    var link = data.query.results.channel.link; 
    var lastUpdated = data.query.results.channel.lastBuildDate; 
    var conditionCode = condition.code; 
    var conditionText = condition.text; 

    var img = document.createElement("IMG"); 
    img.src = "https://s.yimg.com/zz/combo?a/i/us/we/52/" + conditionCode + ".gif"; 
    img.style.marginLeft = "140px"; 

    document.getElementById('Weather-Description2').appendChild(img); 

    document.getElementById('Weather-Location2').innerHTML = location.city; 
    document.getElementById('Weather-Region2').innerHTML = location.region; 
    document.getElementById('Weather-Temp2').innerHTML = condition.temp; 
    document.getElementById('Weather-Unit2').innerHTML = units.temperature; 
    document.getElementById('Weather-WindSpeed2').innerHTML = wind.speed; 
    document.getElementById('Weather-Link2').href = link; 
    document.getElementById('lastUpdate2').innerHTML = lastUpdated; 
    document.getElementById('Weather-text2').innerHTML = "["+conditionText+"]"; 
    document.getElementById('Weather-text2').style.marginLeft = 'auto';  //not working 
    document.getElementById('Weather-text2').style.marginRight = 'auto';  // not working 
} 

HTML：

<strong id="Weather-text2"></strong> 

如果我改變auto像「100px的」 特定像素那麼它的工作原理。可JS在邊緣使用auto？在marginLeft和marginRight上的auto的原因是自動居中該元素。如果是這樣，我該如何正確實施？

Answer 1

A <strong>元素默認爲display: inline。

自動邊距中心元素是display: block（雖然因爲您將缺省設置爲width: auto，除非您也減小寬度，否則這將不會產生實際效果）。

在最近的塊祖先元素上設置text-align: center以居中文本。