認證列印CSS知識點總結

需求：

1、認證內容動態填充；

2、認證背景圖不要求列印，只為展示作用；

3、列印內容相容螢幕解析度；

實現：

  <!-- 外層div寬度為背景圖片寬 -->  <div style="position: relative;width: 1397px;margin: 0 auto;">    <div id="permitImg" style="position: absolute;">        <!-- 背景圖片 -->        <img src="demo.jpg">    </div>    <div class="infos" style="position: absolute;">        <!-- 展示內容 -->        <span style="top: 77px;left: 151px;">認證內容</span>    </div>  </div>

小知識點：

1、span定寬，但文字不換行，設定word-wrap: break-word;

2、調節span填充文字行間距，設定line-height屬性；

3、span定寬定高，超出文字框的內容不展示，設定overflow: hidden;