If this does not work then it is probably CORS you're dealing with. Please do not use the java2s website as a reference for html and css because this site is very very old and not up-to-date.
First, the browser will try to load the modern woff2 font. If it fails then it will try to load the older woff font. The ttf font is a fallback for very old browsers/devices. At the end, if no fonts can be loaded , it falss back to the default serif font.
edit all fonts fail to load. Reason: they has been blocked by CORS policy.
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Web Font Sample</title>
<style>
@font-face {
font-family: 'Bitstream Vera Serif Bold';
font-style: normal;
font-weight: 400;
src: local('Bitstream Vera Serif Bold'),
url('https://mdn.mozillademos.org/files/2468/VeraSeBd.woff2') format('woff2'),
url('https://mdn.mozillademos.org/files/2468/VeraSeBd.woff') format('woff'),
url('https://mdn.mozillademos.org/files/2468/VeraSeBd.ttf') format('truetype');
}
body {
margin: 0;
font-family: "Bitstream Vera Serif Bold", serif;
font-weight: 400;
font-size: 16px;
line-height: 1.5;
}
</style>
</head>
<body>
This is Bitstream Vera Serif Bold.
</body>
</html>
与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…