使用otf文件作为网站的字体

我正在尝试使用otf文件作为我网站的字体，但由于某种原因，它根本没有更改字体。我下载了 otf 文件的 zip，但我上传到目录的唯一文件是 FontAwesome.otf 文件。我做错了什么？

@font-face { 
font-family: 'FontAwesome'; 
src: url('FontAwesome.otf') format('opentype'); 
} 
body { 
font-size: 36px; 
} 
#div1 { 
font-family: 'FontAwesome'; 
border: 1px solid red; 
} 
<div id = 'div1'> The quick </div> The quick