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

[cilek]

سلام دوستان

می شه بگید اگه من بخوام قالب سایت زیر رو ریسپانسیو کنم چیکار باید بکنم؟؟؟

تور ترکیه

 

[ediablo77]

خوب شما اگر دوست عزیز آشنایی ندارید به سیستم واکنش گرا بهتره بدید براتون انجامش بدن چون اگر بخوایید یاد بگیرید چطور اینکارو بکنید کلی زمان میبیره

 

[ediablo77]

ولی خوب میتونی از فریم ورک http://960.gs استفاده کنی

 

[cilek]

آقا دستت درد نکنه داداش یه آموزشی چیزی ندارید من برم مطالعه کنم؟؟

 

[ediablo77]

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

 

[P-khakestari]

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

 

[shahrokh4u]

برای ریسپانسیو کردن قالب باید به Css3 مسلط باشید و به راحتی می توانید قالب رو ریسپانسیو کنید. باید یک بار دیگر فایل css قالب را بازنویسی کنید. و مقادیری که نیاز به ویرایش دارند را تغییر دهید. برای مثال از بالا شروع کنید و تا پایین سایز و اندازه ها رو کم و زیاد کنید. باید منو ها و navigation رو بجای افقی inline-block بصورت عمودی و block زیر هم قرار دهید و همچنین طرح بندی سایدبار و main content یا قسمت محتوای سایت را یکی یکی اندازه ها را تغییر دهید و مقادیر جدید وارد کنید. برای مثال اگر شما یک فایل به نام style.css دارید و ریسپانسسیو نیست برای ریسپانسیو بودن باید کد زیر را انتهای فایل وارد کنید

@media only screen and (min-width : 150px) and (max-width : 780px)

و مقادیر طرح بندی های قسمت های سایت رو بازنویسی کنید و خاصیت های غیر ضروری حذف و فقط خاصیت هایی که با اندازه ها سر و کار دارد ویرایش شود و مقادیر خاصیت هایی مانند , Width, Height, font-size,Padding,Margin و غیره را تغییر دهید. برای مثال اگر مقدار خاصیت width طرح بندی سایدبار برابر با 300px است برای این مقدار اندازه ای برابر با نصف این اندازه قرار دهید که البته اگر این اندازه ها به درصد باشد بهتر است. همچنین برای فونت ها اگر فونت ها ریز هستند چون در تلفن های هوشمند بدلیل صفحه نمایش کوچک تر فونت ها بسیار ریز تر به نمایش در میان باید مقادیر اندازه فونت ها بزرگتر در نظر گرفته شود و همینطور از بالا به پایین سایت تغییرات و اندازه های جدید را وارد کنید. برای اشنایی بیشتر یک قالب بسیار ساده ریسپانسیو قرار دادم تا بیشتر آشنا شوید. توجه کنید قسمتی که تغییرات ریسپانسیو و خاصیت های جدید اعمال می شود در فایل style.css در زیر نوشته Responsive در خط 216 قرار دارد. دو قسمت بالا و پایین این خط را مقایسه کنید تا با مثالی عملی با نحوه ی ریسپانسیو کردن یک قالب آشنا شوید. امیدوارم مفید واقع شود

​

 

[silverhand]

فقط و فقط و فقط Bootstrap
http://getbootstrap.com/
توش کلی هم آموزش و مثال هست.

 

[the110boy]

اول باید با css آشنایی داشته باشی، بعد این آموزش خیلی مفیده:
http://webhub.ir/آموزش-طراحی-responsive-با-استفاده-از-css3

 

[khalilonline]

سلام.

میتونید قالبتون رو ببرید روی فریم ورک هایی همچون بBootstrap

 

[1tools]

www.designr.ir/آموزش-ریسپانسیو-کردن-قالب-با-css/