CSS 圖片轉 Font 是一種將設計師所設計的圖片，通過 CSS 技術將這些圖片轉換成 Web 前端可用的字體（font），從而讓網頁中的圖片可以完全用 HTML 和 CSS 來實現，使網站更加輕便和易于管理。

在轉換圖片到 font 的過程中，我們可以使用諸如 Glyphicons 等各種工具，來幫助我們自動化地將圖片轉成為字體文件。以 Glyphicons 為例，將圖片轉換成字體文件是非常簡單的。我們可以首先將你所需要轉換的圖片上傳到 Glyphicons 官網，再根據提示選擇將這些圖片轉換成 web-fonts 等字體文件格式。

@font-face {
font-family: 'Glyphicons Halflings';
src: url('fonts/glyphicons-halflings-regular.eot');
src: url('fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'),
url('fonts/glyphicons-halflings-regular.woff2') format('woff2'),
url('fonts/glyphicons-halflings-regular.woff') format('woff'),
url('fonts/glyphicons-halflings-regular.ttf') format('truetype'),
url('fonts/glyphicons-halflings-regular.svg#glyphicons-halflingsregular') format('svg');
}

然后，我們可以在 CSS 中使用它來展示我們的圖片：

.icon-img-glyphicons {
width: 14px;
height: 14px;
font-family: 'Glyphicons Halflings';
font-size: 14px;
font-style: normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
content: "\e012";
}

其中 "\e012" 表示了 Glyphicons 官網所生成的字體的編碼值（編碼值可以通過官網獲得或者是通過 CSS 中的 font 編輯器獲得），表示了將圖片轉換成字體后的字體代碼。

這樣就可以非常方便地將圖片轉換成字體，并且通過 CSS 技術進行展示了。需要注意的是，在使用這種技術的時候，需要在 HTML 和 CSS 中引入我們的字體文件，以及正確地進行 CSS 的 font-family 和 font-size 等設置。