راکت
حل شده

مشکل در جلسه های ۶۰ و ۶۱ css

9 پاسخ

سلام من ۲ تا مشکل‌ دارم در جلسه های ۶۰ و ۶۱ دوره css سایت راکت

اول اینکه در جلسه ۶۰ فونت vazir حتی با کپی پیست کردن کد استاد هم درست نمیشه
و دوم در جلسه ۶۱ به placeholder نمی تونم استایل بدم حتی باز کد استاد رو هم کپی پیست کردم نشد
ممنون میشم راه نمایی کنید:)

نیکی
نیکی
@nikizarb
ثبت پرسش جدید

پاسخ‌ها

9
مبینا ستاری
مبینا ستاری
@mobinasattari7

تخصص: توسعه دهنده بک اند

بهترین پاسخ

ببینید الان کدتون دو تا اشکال داره.
یکی توی خطی که فونت فیس رو تعریف کردید، باید اسم فونت رو توی دابل کوتیشن یا سینگل کوتیشن قرار بدید.
دو، الان باید ببینید فایلتون دقیقا کجاست. مثلا تمام این ها رو بریزید توی یه فولدر، توی فولدر پروژه قرار بدید. مثلا فولدر پروژه یک، داخل یه سری فایل و یه فولدر فونت. اگه از ویرایشگر وی اس کد استفاده کنید، اینکار خیلی راحت تره میشه.
بعد وقتی که اون رو توی یه فولدر قرار دادید، اینطوری پیداش کنید:

('../fonts/vazir.eotcc')

نمیدونم میدونید یا نه ولی خود من یه مدت خیلی طولانی درباره این آدرس دهی مشکل داشتم.
وقتی یه چیزی رو توی همون فولدر دارید؛ از یه نقطه (.) استفاده کنید و یه اسلش پشتش. اگه نه توی یه فولدر دیگه ای بود، دو تا نقطه بزنید یه اسلش مثل بالایی البته یه خورده گنگ توضیح دادم اگه ابهامی هست بگید.
اگه مشکلی دیگه ای دارید یا هنوز این مشکل رو دارید؛ باز صدام کنید. چون هی باید امتحان کنید ببینید ایراد از کجاست

فاطمه کاظمی زاده
فاطمه کاظمی زاده
@kazemi

تخصص: Senior front-end در هولدینگ دکتر کرمانی - مدرس مجتمع فنی

نمونه کد خودتون را بفرستید تا راهنمایی کنیم

فاطمه کاظمی زاده
فاطمه کاظمی زاده
@kazemi

تخصص: Senior front-end در هولدینگ دکتر کرمانی - مدرس مجتمع فنی

میتونین کد خودتونم در سایت codepen بزارید و لینکش را قرار بدید تا راهنماییتون کنیم

شاید پاسخ شما همین‌جا باشد

محمدصادق عبداللهی
محمدصادق عبداللهی
@mimsadAlef

تخصص: junior full stack developer

سلام مرورگرتون آپدیته؟

محمدحسن فرهادی
محمدحسن فرهادی
@farhadi

تخصص: علاقه مند به کد نویسی

@nikizarb احتمال اینکه توی ادرس دهی فایل ها(چه سی اس اس چه فونت) اشتباه کرده باشید خیلی زیاده
روت فایل ها رو بر اساس سیستم خودتون چک کنید.

Saman
Saman
@samanzdev

تخصص: برنامه نویس وب

سلام
اگه کد هاتون قرار بدید راحتر مشکلتون حل میشه.
@nikizarb

مبینا ستاری
مبینا ستاری
@mobinasattari7

تخصص: توسعه دهنده بک اند

درود بر شما.
بستگی به آدرسی داره که دادید ممکنه آدرس مدرس با آدرس شما متفاوت باشه.
وقتی که یه پوشه دارید و فایلتون توی همون پوشه است، اینطوری باید صداش بزنید:


 @font-face {
            font-family: 'Vazir';
            src: url('../fonts/vazir.eotcc') format('eot'), url('../fonts/vazir.ttf') format('truetype'), url('../fonts/vazir.woff') format('woff'), url('../fonts/vazir.woff2') format('woff2');
        }

ببینید الان آدرس من این شکلیه شما نمونه کدتون رو بگذارید راحت تر راهنمایی میکنیم

نیکی
نیکی
@nikizarb

خیلی ممنونم از جوابتون ولی بازم کار نمیکنه
@mobinasattari7
کد فایل css

html {
  font-size: 100%;
  font-family: "Vazir";
}

و کد فایل vazir.css

@font-face {
    font-family: Vazir;
    src: url('Vazir.eot');
    src: url('Vazir.eot?#iefix') format('embedded-opentype'),
         url('Vazir.woff2') format('woff2'),
         url('Vazir.woff') format('woff'),
         url('Vazir.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: Vazir;
    src: url('Vazir-Bold.eot');
    src: url('Vazir-Bold.eot?#iefix') format('embedded-opentype'),
         url('Vazir-Bold.woff2') format('woff2'),
         url('Vazir-Bold.woff') format('woff'),
         url('Vazir-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
}
@font-face {
    font-family: Vazir;
    src: url('Vazir-Black.eot');
    src: url('Vazir-Black.eot?#iefix') format('embedded-opentype'),
         url('Vazir-Black.woff2') format('woff2'),
         url('Vazir-Black.woff') format('woff'),
         url('Vazir-Black.ttf') format('truetype');
    font-weight: 900;
    font-style: normal;
}
@font-face {
    font-family: Vazir;
    src: url('Vazir-Medium.eot');
    src: url('Vazir-Medium.eot?#iefix') format('embedded-opentype'),
         url('Vazir-Medium.woff2') format('woff2'),
         url('Vazir-Medium.woff') format('woff'),
         url('Vazir-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
}
@font-face {
    font-family: Vazir;
    src: url('Vazir-Light.eot');
    src: url('Vazir-Light.eot?#iefix') format('embedded-opentype'),
         url('Vazir-Light.woff2') format('woff2'),
         url('Vazir-Light.woff') format('woff'),
         url('Vazir-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
}
@font-face {
    font-family: Vazir;
    src: url('Vazir-Thin.eot');
    src: url('Vazir-Thin.eot?#iefix') format('embedded-opentype'),
         url('Vazir-Thin.woff2') format('woff2'),
         url('Vazir-Thin.woff') format('woff'),
         url('Vazir-Thin.ttf') format('truetype');
    font-weight: 100;
    font-style: normal;
}

ولی فونت کار نمیکنه

نیکی
نیکی
@nikizarb

@samanzdev
بخش فونت رو برای خانم موبینا فرستادم و قسمت placeholder هم این هستش
فایل html

<h2 class="form-title">فرم ثبت نام </h2>
            <label for="name">نام </label>
            <input type="text" name="full name" id="title" placeholder="لطفا نام خود را وارد کنید">
            <!-- <input type="text" name="name" id="name"> -->
            <label for="email">ایمیل</label>
            <input type="email" name="email" id="email" placeholder="لطفا ایمیل خود را وارد کنید">
            <!-- <input type="email" name="email" id="email"> -->
            <label for="password">پسورد </label>
            <input type="password" name="password" id="password" placeholder="لطفا رمز خود را وارد کنید">
            <!-- <input type="password" name="password" id="password"> -->
            <label for="password-confirm">تکرار پسورد</label>
            <input type="password-confirm" name="password-confirm" id="password-confirm" placeholder="لطفارمز خود را تکرار کنید ">
            <label for="rules">
                    <input type="checkbox" name="rules" id="rules" >قوانین رو قبول دارم
            </label>

اینم css

.form input.form-control::placeholder {
  color: red;
}

.form input.form-control::-moz-placeholder {
  color: red;
} 

.form input.form-control:-moz-placeholder {
  color: red;
} 

.form input.form-control::-webkit-input-placeholder {
  color: red;
} 

.form input.form-control::-ms-input-placehoder {
  color: red;
}

برای ارسال پاسخ لازم است وارد شده یا ثبت‌نام کنید

ورود یا ثبت‌نام