SOURCE

$('input').on('change', function(e) {
  $('.inline').css('font-family', e.target.value);
})

<div class="box">
  <span class="inline">
    abcdegf
  </span>
</div>
<label for="
Yahei">
  <input type="radio" id="Yahei" name="font" value="Microsoft Yahei">
  Microsoft Yahei微软雅黑
</label>
<label for="
simsun">
  <input type="radio" id="simsun" name="font" value="simsun">
  simsun宋体
</label>

<p>微软雅黑半行间距 (360-317)/2 = 21.5</p>
<p>宋体半行间距 (360-240)/2 = 60</p>

* {
  margin: 0;
  padding: 0;
}

.box {
  height: 360px;
  background: yellow;
  border: 1px solid red;
  margin: 30px auto;
}

.inline {
  font-size: 240px;
  line-height: 360px;
  outline-style: solid;
  outline-width: 2px;
  background-color: white;
  font-family: 'simsun';
}