انجمن سایت کلیدستان



تغییر حالت منو با cssزمان کنونی: ۱۳۹۵/۰۹/۱۳، ۱۲:۲۹ ق.ظ
کاربران در حال بازدید این موضوع: 1 مهمان
نویسنده: puzel.ir
آخرین ارسال: admin
پاسخ 3
بازدید 97

رتبه موضوع:
  • 0 رای - 0 میانگین
  • 1
  • 2
  • 3
  • 4
  • 5
تغییر حالت منو با css

تغییر حالت منو با css

#1
با سلام دوستان

من میخواستم این دو بخش که در عکس مشخص شده به جای اینکه زیر هم باشن کنار هم باشن

   

این برای بخش صفحه سبد خرید ماست
ادرس سایتمونم http://www.puzel.ir می باشد

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

تغییر حالت منو با css

#2
با سلام.
توصیه می شود که از فایل W3.CSS که توسط سایت معتبر w3schools.com ارائه شده است، استفاده نمایید :

http://www.w3schools.com/w3css/default.asp

این فایل، علاوه بر اینکه امکان ساخت اینگونه ترکیب ها (تعدادی ستون در کنار هم) را به شما می دهد، ساختار سایت را هم responsive خواهد کرد. یعنی در صفحه نمایش های کوچک (مثل موبایل ها)، ستون ها جابجا می شوند و به جای کنار هم بودن در جهت افقی، یکی به ردیف بعد رفته و عملا در جهت عمودی قرار می گیرند تا کاربر به راحتی محتوای هر دو را ببیند (این ویژگی خیلی مهم است و در نهایت هرکس باید responsive بودن را برای سایت خود رعایت کند).
خود سایت w3schools.com ، راهنماهای زیادی برای استفاده از آن دارد که در همان لینک ذکر شده، موجود می باشند.
راهنما برای طراحی ستون های با اندازه های مختلف (به صورت 2 یا 3 یا 4 ستون و یا ترکیبی از یک دوم و یک سوم و یک چهارم عرض صفحه) :

http://www.w3schools.com/w3css/w3css_responsive.asp

راهنما برای طراحی ستون های با اندازه های مختلف (انعطاف پذیر با بخش پذیری به 12 قسمت و بر اساس سه اندازه صفحه نمایش small و medium و large) :

http://www.w3schools.com/w3css/w3css_grid.asp

مثلا تعریف ستون زیر را ببینید (بر اساس W3.CSS و حالت 12 قسمتی برای عرض صفحه) :

کد پی‌اچ‌پی:
<div class="w3-col s5 m4 l3"

s مخفف small و m مخفف medium و l مخفف large می باشد. کد بالا یعنی ستون، در صفحه نمایش با اندازه small ، به اندازه 5 قسمت از 12 قسمت کل (کل عرض صفحه)، عرض صفحه نمایش را بپوشاند (اندازه عرض آن برابر پنج دوازدهم از کل عرض صفحه نمایش باشد). برای medium به اندازه 4 قسمت از 12 قسمت و برای large به اندازه 3 قسمت از 12 قسمت (به اعداد در نام کلاس ها توجه کنید).

نکته مهم : در توضیحات بالا، بنده لغت ((صفحه نمایش)) را به کار بردم زیرا فرض کرده ام که عنصری که این ستون را در بر گرفته، کل صفحه نمایش را می پوشاند، در صورتی که صحیح تر این است که بگوییم پنج دوازدهم عرض ((عنصر حاوی این ستون)).

Flower
bookbook 
لطفا برای درج کد، از دکمه مخصوص درج کد در ادیتور انجمن استفاده کنید.
در مورد برنامه نویسی، مدیران تنها راهنمایی می کنند و نوشتن برنامه نهایی، به عهده کاربران می باشد (اینجا محلی برای یادگیری است، نه سفارش کدنویسی).
کاربران باید ابتدا خود به خطایابی برنامه بپردازند، نه اینکه به محض دیدن خطا، کدها را در انجمن، copy و paste کرده و از مدیران انتظار بررسی داشته باشند.
پاسخ

تغییر حالت منو با css

#3
سلام.
توصیه اصلی بنده در ارسال قبل ذکر شده است، اما اگر یک راه حل سریع و ساده را می خواهید (بدون استفاده از هیچ فایل CSS ای)، کلید زیر می تواند مفید باشد :

کلید شماره 2501

Flower
bookbook 
لطفا برای درج کد، از دکمه مخصوص درج کد در ادیتور انجمن استفاده کنید.
در مورد برنامه نویسی، مدیران تنها راهنمایی می کنند و نوشتن برنامه نهایی، به عهده کاربران می باشد (اینجا محلی برای یادگیری است، نه سفارش کدنویسی).
کاربران باید ابتدا خود به خطایابی برنامه بپردازند، نه اینکه به محض دیدن خطا، کدها را در انجمن، copy و paste کرده و از مدیران انتظار بررسی داشته باشند.
پاسخ


پرش به انجمن:


کاربران در حال بازدید این موضوع: 1 مهمان

آخرین کلیدهای غیررایگان

شما هم می توانید کلیدهای غیررایگان منتشر کنید (بیشتر بدانید)