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

66 votes262 views6 answers
How to center a div with position absolute
CSS
2 votes278 views2 answers
Css heading background line
CSS
2 votes251 views1 answer
Scss function
CSS
4 votes298 views4 answers
Conditionally assign a css class angular 9
CSS
0 vote270 views1 answer
Css preloader, preload website screen
CSS
4 votes332 views1 answer
Css add dots if text too long
CSS
-1 vote315 views1 answer
Materialize table padding css
CSS Materialize
0 vote278 views2 answers
Use .map to count length of each element in an array
CSS
6 votes262 views6 answers
TAilwind css
CSS
3 votes257 views2 answers
Box sizing ftw
CSS