あなたがChrome/Safariを使用している場合、initial
は何をしたいのですか?設定後、アクティブなスタイルはinitial
、計算されたスタイルはブラウザのデフォルトとして表示されます。
アクティブなスタイルをデフォルトに設定するには、一時的な要素を作成し、要素のプロパティを一時的な値に設定します。
デモ:http://jsfiddle.net/ThinkingStiff/Yb9J9/
スクリプト:
Element.prototype.setDefaultStyles = function() {
var element = document.createElement(this.tagName),
styles = window.getComputedStyle(element),
display = styles.getPropertyValue('display');
element.style.display = 'none';
document.body.appendChild(element);
for(style in styles) {
this.style[styles[style]] = styles.getPropertyValue(styles[style]);
};
this.style.display = display;
document.body.removeChild(element);
};
document.getElementById('unstyled').setDefaultStyles();
HTML:
<div id="styled">styled</div>
<div id="unstyled">unstyled</div>
CSS:
#styled, #unstyled {
border: 1px solid red;
color: green;
width: 100px;
height: 50px;
}
出力:
関連:http://stackoverflow.com/questions/15901030/reset-remove-css-styles-for- element-only/15903168 –