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

سلام

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

حالا من میخوام در سایز مثلا 1500 px یا همون ویندوز مثلا بخش X نمایش داده بشه

اما حالا میخوام بخش X در سایز 980px نمایش داده نشه ، که به طور معمول display:none; رو در کلاس قرار میدیم.

خب حالا من میخوام همون بخش X در سایز 480px نمایش داده بشه .

چون بخش 980 غیر فعال هست در 480 نشون نمیشه ... حتی کلاس رو هم داخلش گذاشتم و بخش display:none; رو پاک کردم اما باز هم نمایش داده نشد.

display:run-in; رو هم تست کردم بازهم نمایش داده نشد.

دقیقا باید چه دستوری وارد کنم که نمایش داده بشه !؟

ممنون

0

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


لینک به پست

سلام ، display:none مخالفی نداره ، برای مخفی کردن میتونید از visibility استفاده کنید که visible و hidden داره ، امّا اگر مجبور به استفاده از display هستید میتونید با استفاده از مرورگر تست کنید که کدوم از مقدار ها به کارتون میاد ، گاه ممکنه block یا شایدم inherit یا initial به کارتون بیاد ، شما از طریق inspect element مرورگر امتحان کنید بالآخره یکی از مقدار هاش به دردتون میخوره.

2

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


لینک به پست

display:block;

1

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


لینک به پست

بهترین مخالف تو مثالی که زدید


display:block;

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


display: block !important;

1

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


لینک به پست

سلام ، display:none مخالفی نداره ، برای مخفی کردن میتونید از visibility استفاده کنید که visible و hidden داره ، امّا اگر مجبور به استفاده از display هستید میتونید با استفاده از مرورگر تست کنید که کدوم از مقدار ها به کارتون میاد ، گاه ممکنه block یا شایدم inherit یا initial به کارتون بیاد ، شما از طریق inspect element مرورگر امتحان کنید بالآخره یکی از مقدار هاش به دردتون میخوره.


display:block;

بهترین مخالف تو مثالی که زدید


display:block;

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


display: block !important;

تشکر از همگی صحیحش این بود.

display: inherit;

4

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


لینک به پست

مخالفش این میشه


display: initial;

که البته مرورگرای قدیمی از initial پشتیبانی نمیکنن ، و برای رفع این مشکل میتونین قبلش block یا inline-block یا هر چیز دیگه ای بنا به نیازتون تعریف کنین که مرورگرای قدیمی هم به مشکل نخورن ، به عنوان مثال المنت شما باید inline-block باشه تو حالتی که از مخفی در میاد :


display: inline-block;
display: initial;

2

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


لینک به پست
تشکر از همگی صحیحش این بود. display: inherit;

بله همونطور که گفتم در جاهای مختلف ممکنه جواب های مختلف بگیرید.

یه توضیح کوتاه بدم حالا که تاپیک گرفت:

initial مقدار پیش فرض هست که البتّه همونطور که دوست عزیزمون امین گفت در بعضی از مرورگر ها از جمله اینترنت اکسپلورر پشتیبانی نمیشه

inherit مقدار تعیین شده در والد هست! یعنی اینکه اگر توی کد زیر به div شما block داده باشید یا رنگ red برچسب span هم همون مقدار رو میگیره.


<div>
<span>
</span>
</div>

در این کد div والد محسوب میشه و اگر بهش inherit بدید span هم اون مقدار رو از والد خودش میگیره

و امّا در مورد block مخالف none نیست ، البتّه بیشتر جاها به کار میاد ولی مشکلش اینکه اگر شما مقدار block رو بهش بدید در واقع دارین اون رو یه بلوکه حساب میکنین و به خط بعدی میره (دقیقاً مثل پاراگراف)

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

http://www.w3schools.com/cssref/playit.asp?filename=playcss_display&preval=block

1

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


لینک به پست

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

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

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

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


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

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

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


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

  • مطالب مشابه

    • توسط jistili1
      سلام دوستان.من اومدم به قول خودم سایتم رو با استفاده از دستور های media query در css ریسپانسیو کردم.سایتم اینه:namavaz.ir.اومدم برای سایز های مختلف device سایت رو تعریف کردم.ولی الان وقتی سایت رو باز میکنید اصلا کاری به مدیاکوئری ها نداره.همون صفحه ای که روی لپتاپم میاره رو روی موبایل میاد زوم بک میکنه.اگه سایز مرورگر رو توی لپتاپ تغییر بدم مدیاکوئری ها کار میکنن ولی روی موبایل مشکل داره.ممنون میشم راهنمائیم کنید.
    • توسط Hassan Hesampour
      سلام دوستان وقتتون بخیر
      آقا ما یه سایت داریم به آدرس : dryouclinic.com 
      توی قسمت بلاگ ( نوشته های سایت ) بخصوص مطالبی که اخیرا توی سایت درج شده ، ریسپانسیو مطالب دچار مشکل شده
      یعنی الان هر نویسنده ای که بخواد مطلب جدید بذاره نحوه چیدمان نوشته ها میریزه بهم
      تمام افزونه ها رو غیر فعال کردم بازم نشد
      مشکل از خود قالب هست اما نمیدونم چه مشکلی برای قالب پیش اومده که جدیدا وقتی مطلب میذاریم میریزه بهم ، یادم هم نمیاد که چه تغییری توی سایت دادیم که این مشکل پیش اومد
      عکس ضمیمه رو ببینید تا بهتر متوجه منظورم بشید ، ممنون میشم اگر کسی مشکل رو فهمید کمکم کنه

    • توسط pouria7777
      سلام خسته نباشید
      میخواستم ببینم اگر بخوام این مجموعه عکس بالا رو توی موبایل به همین صورت و ترتیب نشون بدم چیکار باید بکنم؟ یعنی سایزشون کوچیک بشه به جای این که به هم ریخته بشن و از حالت خطی در بیان.

    • توسط kamran.azarniya
      سلام و درود
      بنده در این سایتم کمی مشکل منو داشتم نمیدونم چه تنظیماتی کردم که منو از جایگاه اصلی خودش اومده پایینتر ، حالا به نظرتون باید چیکار کنم یا چه کدیو اصلاح کنم
      تشکر
      avahesab.ir
    • توسط j1989m
      سلام 

      یه اسلایدر ریسپانسیو و تاچ میخوام که عناصر داخل هریک از اسلایدها با انیمیشن ظاهر و ناپدید بشن 
      (شبیه اسلایدر این سایت : https://payment24.ir/ ولی خب این تاچ نیست و با بوت استرپه) 

      ببینید مثلا اسلایدر زیر رو با owl carousel ساختم و میخوام با نمایش اسلایدها title و description با انیمیشن دلخواه خودم نمایش و ناپدید بشن: 

      https://codepen.io/j1989mah/pen/VzoOmY 

      با رویدادهای owl carousel میشه اینکارو کرد؟ کسی با ایونت های کاروسل کار کرده؟ 
      https:/owlcarousel2.github.ioOwlCarousel2docs/api-events.html