kazemztc

مشکل ریسپانسیو

10 پست در این موضوع قرار دارد

با سلام

دوستان خواهشا کمک کنید

هر کاری میکنم قالب درست نمیشه

تو گوگل وبمستر سایت گیر داده بود که باید سایت رو به گوگل موبایل فرندلی تبدیل کنی حالا طبق گفته های خودش پیش رفتم مینویسه داخل تست موبایل که با موفقیت انجام شده ولی حالا تمامی سایت به هم ریخته دوستان یک روش خوب یا یک کاری بگین انجام بدم درست بشه خیلی خیلی ممنون میشم

0

به اشتراک گذاری این پست


لینک به پست

سلام ! الان دقیقا ما میتونیم چه کمکی به شما بکنیم اخه !؟ باید با کد نویسی رسپانسیو اشنا باشید یک خط دو خط نیست که ما بخوایم راهنمایی کنید ! یا قالبتون رو با ی قالب ریسپانسیو عوض کنید !

یا برید دنبال فراگیری این علم که خودتون انجام بدین یا این که هزینه کنید براتون انجام بدن !

ی کار دیگه هم میشه ! یک سری افزونه هست نصب میکنید خودش واسه دستگاه های موبایل ی قلب پیش فرض رو میاره بالا ! با این کار دیگه قالب اصلی تون رو هم تغییر نمیدین !

ویرایش شده در توسط RedPlus
1

به اشتراک گذاری این پست


لینک به پست

با این کد میشه انجام داد

@media screen and (max-width: 980px) { . Logo { widh: 100%;

}

@media screen and (max-width: 800px) { . Logo { widh: 100%;

}

@media screen and (max-width: 680px) { . Logo { widh: 100%;

}

@media screen and (max-width: 480px) { . Logo { widh: 100%;

}

@media screen and (max-width: 320) { . Logo { widh: 100%;

}

0

به اشتراک گذاری این پست


لینک به پست

بله میشه انجام داد ! الان امدین توی همه صفحه نمایش ها اندازه عرض لوگو رو 100 درصد دادین !

1

به اشتراک گذاری این پست


لینک به پست
بله میشه انجام داد ! الان امدین توی همه صفحه نمایش ها اندازه عرض لوگو رو 100 درصد دادین !

عزیز میشه یکم توضیح بدین که شروع کنم خودم ریسپانسیو کنم خیلی ممنون

0

به اشتراک گذاری این پست


لینک به پست

یکی از راه های رسپانسیو کردن با بوت استرپ هست :

http://forum.wp-pars...-قالب-وردپرس-و/

آموزش فراوان در سطح نت هست به صورت کامل فقط باید همت کنید و جستجو کنید ! به فرضدر گوگل بزنید آموزش media در css ! به همین سادگی !

ویرایش شده در توسط RedPlus
1

به اشتراک گذاری این پست


لینک به پست

زدم خیلی جستجو کردم ولی مثل کد بالا واسه لوگو 100% رو زدم

حالا شما لطف کنید بگین که این درصد چطوری واسه تگ ها متفاوت است؟

0

به اشتراک گذاری این پست


لینک به پست

1- شما مفهوم مدیا رو معلوم نفهمیدین :) باز هم سرچ کنید !

درصدش بستگی به خودتون داره الان 4 تا اندازه هست هر مدیا واسه یک اندازه و یک نمایشگر ! چیزی نیست که بگیم تو همه قالب ها اندازش یا درصدش یک عدد هست ! داخل مدیا ها کلاس ها رو فراخوانی میکنن و میگن اون کلاس در اون نمایشگر به چه صورت نمایش داده بشه !

ویرایش شده در توسط RedPlus
1

به اشتراک گذاری این پست


لینک به پست

میتونم با این کد قالب رو ریسپانسیو کنم

لطفاً اگه مطلبی مورد تظرتون هست لینک بدین من ببینم بسیار ممنون میشم

0

به اشتراک گذاری این پست


لینک به پست

سلام به زبون فریم ورکی میگم که فهم ش راحت تر :دی

فک کنید عرض صفحه شما شامل ده ستون زمانی که دارید بایک نمایشگر بزرگ نگاه میکنید دوست لوگو گوشه سایت و کوچیک یعنی فقط دو ستون از ده ستون رو گرفته پس

@media screen and (max-width: 980px) { . Logo {دو ستون;

}

حالا با نمایشگر کوچیک تر نگا میکنید اگه قرار باشه اینجا هم همون دو ستون بگیره برای اینکه بتونید لوگو رو ببینید باید زوم کنید! پس این یک قالب معمولی ست ! راه حل چیه راه حل اینکه اینبار بیایم بگیم اگر نمیاشگر عرضی برابر با این مقدار داشت بجا دو ستون از 5 ستون استفاده بشه

@media screen and (max-width: 680px) { . Logo { پنج ستون;

}

حالا اگه بازم اندازه نمایشگرما کوچیکتر بود فک کنید موبایل بود حالا بهش میگیم بجا 5 ستون بیا و برای نمایش لوگو از همه ستون ها استفاده کن !

مثلا تصویر زیر ما عرض صفحه رو دوازده ستون تقسیم کردیم که هر ستون از هر طرف مقداری پدینگ لفت و رایت داره (این تقسیم بندی دیفالت بوتاسترپ که قابل تغییر)

12-grid.png

خوب حالا تو تصویر زیر اومده تو سطر اول برای هر قسمت یک ستون اختصاص داده تو سطر دوم چهار تا و... امیدوارم مفهوم رو فهمیده باشید ، قبل از اینکه دنبال اموزش قالب های واکنشگرا باشید تعاریف ش بخونید و مفهوم ش درک کنید . به نظر من ! :)

4a863a22-74d5-45da-b447-d3e7f03877a3.jpg

1

به اشتراک گذاری این پست


لینک به پست

برای ارسال نظر یک حساب کاربری ایجاد کنید یا وارد حساب خود شوید

برای اینکه بتوانید نظر ارسال کنید نیاز دارید که کاربر سایت شوید

ایجاد یک حساب کاربری

برای حساب کاربری جدید در انجمن ما ثبت نام کنید. عضویت خیلی ساده است !


ثبت نام یک حساب کاربری جدید

ورود به حساب کاربری

دارای حساب کاربری هستید؟ از اینجا وارد شوید


ورود به حساب کاربری