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

1 vote227 views1 answer
Css div fill whole page
CSS
0 vote213 views1 answer
Different :after and ::after
CSS
6 votes190 views2 answers
Linear gradient syntax
CSS
0 vote268 views2 answers
Animate.css not working
CSS
2 votes250 views2 answers
Positioning button inside div
CSS
2 votes192 views1 answer
Xpath vs css selector
CSS
0 vote236 views1 answer
Html invisible hr
CSS
0 vote240 views1 answer
Blue color when button click web mobile
CSS
2 votes195 views1 answer
How to disable div onclick in javascript
CSS
0 vote332 views1 answer
How to set initial state after first time in formik
CSS