webmaster404

مشکل در طراحی قالب ریسپانسیو

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

سلامب

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

مثلا من این کد رو قرار میدم تا استایل مخصوص رزولیشن 360 این باشه:


@media only screen and (max-width:360px){
.wrapper{
width: 326px;
direction:rtl;
margin: 0 5px;
}

ولی باز مرورگر استایل اولیه رو در نظر میگیره. یعنی همون استایلی که موقع طراحی بهش داده بودم رو.

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

همراه پست یه عکس هم ضمیمه کردم.

دوستان اگر کسی بلده راهنمایی کنه.

ممنون

post-3674-0-10779500-1411044576_thumb.pn

0

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


لینک به پست

1 . بهتره از این مدیا کوئری استفاده کنید :


@media (min-width: 360px) and (max-width: 480px) {

}

یا :


@media (max-width: 360px) {

}

2. در ریسپانسیو از % استفاده میشه نه px

3. کدهای ریسپانسیو باید زیر کدهای اصلی استایل قرار بگیره

یعنی اگه همه کدهاتون داخل یک فایل هست باید کدهای ریسپانسیو رو آخر از همه قرار بدین

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

4. زمانی که میخواین اولویت بدین میتونین در انتهای کد از !important اسفاده کینن


.test { width:100px !important;}

2

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


لینک به پست

1 . بهتره از این مدیا کوئری استفاده کنید :


@media (min-width: 360px) and (max-width: 480px) {

}

یا :


@media (max-width: 360px) {

}

2. در ریسپانسیو از % استفاده میشه نه px

3. کدهای ریسپانسیو باید زیر کدهای اصلی استایل قرار بگیره

یعنی اگه همه کدهاتون داخل یک فایل هست باید کدهای ریسپانسیو رو آخر از همه قرار بدین

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

4. زمانی که میخواین اولویت بدین میتونین در انتهای کد از !important اسفاده کینن


.test { width:100px !important;}

lممنون فرهاد جان گذینه 3 کارم راه انداخت.

0

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


لینک به پست

ببخشید چطور میشه استایل هایی که توی فایل اصلی قرار دادم توی حالت دومی (همون فایل ریسپانسیو) اعمال نشه؟ مثلا نمیخوام هیچکدوم از :hover ها اعمال بشه!؟؟

0

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


لینک به پست

ببخشید چطور میشه استایل هایی که توی فایل اصلی قرار دادم توی حالت دومی (همون فایل ریسپانسیو) اعمال نشه؟ مثلا نمیخوام هیچکدوم از :hover ها اعمال بشه!؟؟

کافیه در مدیای که نمی خواید هاور عمل کنه استایلهای هاور رو دقیقا مثل استایلهای حالت غیر هاور قرار بدید .

0

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


لینک به پست

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

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

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

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


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

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

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


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