How to add font otf format in html

/*default version*/
@font-face {
	font-family: 'lovelyFont';
	src: url('fonts/lovely_font.eot'); 
	src: 
		local('Lovely Font'),
		local('Lovely-Font'),
		url('fonts/lovely_font.otf') 
		format('opentype');
}
/*bold version*/
@font-face {
	font-family: 'lovelyFont';
	src: url('fonts/lovely_font_bold.eot'); 
	src: 
		local('Lovely Font Bold'),
		local('Lovely-Font-Bold'),
		url('fonts/lovely_font_bold.otf') 
		format('opentype');
	font-weight: bold;
}
/*container element*/
div { font-family: 'lovelyFont', sans-serif; }
/*span elements inside the container div*/
span { font-weight: bold; }

Similar codes

12 votes372 views3 answers
Vertical and horizontal align center div
CSS
0 vote346 views1 answer
Remove border radius select css
CSS
37 votes712 views6 answers
Overflow in css
CSS
0 vote337 views1 answer
Ipad pro css
CSS
0 vote398 views1 answer
If you're trying to use a package make sure that '../../static/fonts/lato/Lato-Regular.woff' is installed. If you're trying to use a local file make sure that the path is correct.
CSS
0 vote394 views1 answer
List-style-type flex
CSS
0 vote341 views1 answer
Bootstrap progress bar animation not working
CSS
8 votes301 views5 answers
Css triangle
CSS
2 votes388 views2 answers
Vertical align span tailwindscss
CSS
2 votes336 views1 answer
Ion input change font size
CSS