@font-face {
font-family: BYekan;
font-style: normal;
font-weight: normal;
src: url(../resources/BYekan.eot);
/* IE9 Compat Modes */
src: url(../resources/BYekan.woff) format('woff'),
url(../resources/BYekan.woff2) format('woff2'),
/* Super Modern Browsers */
url(../resources/BYekan.ttf) format('ttf'),
/* Safari, Android, iOS */
}
* {
box-sizing: border-box
}
img {
vertical-align: middle;
}
.mySlides {
display: block;
width: 100%;
height: 500px;
}
.tab {
direction: rtl;
unicode-bidi: bidi-override;
right: 0;
position: absolute;
margin-top: 4%;
margin-right: 5%;
z-index: 10 !important;
}
.tab-buuton {
background-color: transparent;
border-color: transparent;
color: white;
font-family: BYekan !importan;
font-size: 16px;
}
.logoHolder {
width: 50px;
margin-left: 40%;
position: absolute;
margin-top: 1%;
z-index: 10 !important;
}
.login {
width: 150px;
position: absolute;
margin-top: -33%;
margin-left: 2%;
z-index: 10 !important;
direction: rtl;
unicode-bidi: bidi-override;
}
.loginTypography {
color: white;
position: absolute;
background-color: transparent;
border-color: transparent;
font-family: BYekan !important;
direction: rtl;
font-size: 16px;
margin-right: 10%;
}
.slideshow-container {
max-width: 100%;
position: relative;
margin: auto;
}
.caption {
color: #f2f2f2;
font-size: 40px;
padding: 8px 12px;
position: absolute;
margin-left: 10%;
font-family: BYekan !important;
bottom: 50%;
min-width: 160px;
text-align: center;
}
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
<script src="https://kit.fontawesome.com/1228ed801f.js" crossorigin="anonymous"></script>
<div class="tab">
<button class="tab-buuton" onclick="">صفحه اصلی</button>
<div class="dropdown">
<button class="tab-buuton" onclick="">ورزش ها</button><i class="fa-solid fa-caret-down" style="color: #ffffff;margin-right: -7px"></i>
<div class="dropdown-content"><a href="#">فیتنس</a><a href="#">رزمی</a><a href="#">توپی</a></div>
</div>
<button class="tab-buuton" onclick="">اجاره سالن</button><button class="tab-buuton" onclick="">درباره ما</button>
</div>
</body>
Hello
I attempted to include a custom font in my CSS using @font-face, however, it doesn't seem to be displaying in the browser and I'm unsure why.
The file path of the font is accurate, the font file itself isn't corrupted, and no errors are showing up in the console.
I've also tried using different font files but still no luck.
Any suggestions on what steps I might be missing or overlooking?
Your assistance is greatly appreciated.