TAG
CSS
JavaScript
Result
Run
License
<h1 class="title">window.getComputedStyle() Method</h1> <button type="button" id="btn-get">Get Style</button> <h4>All Style</h4> <pre class="style-all"></pre> <h4>border-bottom</h4> <pre class="style-borderBottom"></pre> <h4>padding-bottom</h4> <pre class="style-paddingBottom"></pre>
.title { border-bottom: 1px solid #CCC; padding-bottom: 10px; }
window.addEventListener("load", function() { document.querySelector("#btn-get").onclick = function() { var cssStyle = window.getComputedStyle(document.querySelector(".title")); document.querySelector(".style-all").textContent = cssStyle.cssText; document.querySelector(".style-borderBottom").textContent = cssStyle.getPropertyValue("border-bottom"); document.querySelector(".style-paddingBottom").textContent = cssStyle.getPropertyValue("padding-bottom"); }; });
Console
expand_less
License
License
by DevDic
Close