babak78 را https://zarinhost.com/forum/topic/217-%DA%86%D8%B7%D9%88%D8%B1-%D9%85%DB%8C-%D8%AA%D9%88%D9%86%D9%85-%DB%8C%D9%87-%D8%B3%D8%B1%DB%8C-%DA%A9%D8%AF-css-%D8%A8%D9%87-%D8%B3%D8%A7%DB%8C%D8%AA-%D9%88%D8%B1%D8%AF%D9%BE%D8%B1%D8%B3%DB%8C%E2%80%8C%C2%A0%D8%A7%D8%B9%D9%85%D8%A7%D9%84-%DA%A9%D9%86%D9%85-%DA%A9%D9%87-%D9%81%D9%82%D8%B7-%D8%AF%D8%B1%C2%A0%D8%AA%D8%A8%D9%84%D8%AA-%D9%88-%D9%85%D9%88%D8%A8%D8%A7%DB%8C%D9%84-%D9%86%D9%85%D8%A7%DB%8C%D8%B4-%D8%AF%D8%A7%D8%AF%D9%87-%D8%A8%D8%B4%D9%87%D8%9F/?do=findComment&comment=277 پسندید که متلعق است به پاسخی برای یک سوال در چطور می تونم یه سری کد CSS به سایت وردپرسی اعمال کنم که فقط در تبلت و موبایل نمایش داده بشه؟
سلام @babak78 عزیز
برای اعمال کد CSS که فقط در دستگاه‌های تبلت و موبایل نمایش داده بشه، می‌تونید از "media query" استفاده کنید. این روش به شما اجازه می‌ده استایل‌ها رو بر اساس اندازه صفحه دستگاه کاربر محدود کنید. کافیه قطعه کد زیر رو به CSS سایت خودتون اضافه کنید:
/* استایل برای تبلت */
@media (max-width: 1024px) {
/* کدهای CSS شما برای تبلت اینجا قرار می گیره */
}
/* استایل برای موبایل */
@media (max-width: 768px) {
/* کدهای CSS شما برای موبایل اینجا قرار می گیره */
}
بخش اول با (max-width: 1024px) استایل‌ها رو به صفحاتی با عرض 1024 پیکسل یا کمتر (تبلت‌ها) محدود می‌کنه.
بخش دوم با (max-width: 768px) استایل‌ها رو به موبایل‌ها که عرض صفحه‌شون 768 پیکسل یا کمتر هست، محدود می‌کنه.
برای اضافه کردن این کدها در وردپرس، می‌تونید از بخش نمایش > سفارشی‌سازی > CSS اضافی این کدها رو قرار بدید یا اون‌ها رو مستقیماً به فایل استایل قالب (style.css) اضافه کنید.
این کار به شما کمک می‌کنه طراحی سایتتون رو برای نمایش بهتر در دستگاه‌های موبایل و تبلت بهینه کنید.
