Разопаковане на стойности на CSS свойства в JavaScript

При четене на атрибута style съкратените CSS свойства се разопаковат в своите пълни свойства. Нека да видим какво се има предвид. Нека за нас е зададен отстъп за всички страни:

javascriptelem.style.margin = '20px';

Нека го изведем:

javascriptconsole.log(elem.style.margin); // ще изведе '20px';

При това четенето на свойства за отделни страни също ще бъде достъпно:

javascriptconsole.log(elem.style.marginLeft); // ще изведе '20px';
Задание 1

Даден е div:

html<div id="elem" style="width: 300px; height: 200px; border: 1px solid red;">
  text
</div>

Дадена е и бутон. При клик върху бутона изведете дебелината на границата, нейния тип и цвят.