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 vote136 views1 answer
@media only screen and (min-width : 1279px) and (max-width : 1400px)
CSS
1 vote136 views1 answer
Ion-tab-bar transparent
CSS
0 vote149 views1 answer
Background pulled to corner on small screens
CSS
0 vote147 views1 answer
Make font awesome spin but not the word on hover
CSS
0 vote147 views1 answer
Css how to center a link
CSS
2 votes155 views6 answers
Tailwindcss
CSS
3 votes212 views1 answer
Css perfect box shadow
CSS
0 vote158 views1 answer
How to use bootstrap color variables in sass
CSS
0 vote150 views3 answers
Style highlight css
CSS
122 votes144 views6 answers
How to center in css
CSS