مهدیه امیری

نحوه resize شدن ارتفاع header با توجه به سایز مانیتورهای مختلف

مهدیه امیری ۱۳۹۴/۰۷/۲۴ 166 زبان سی‌اس‌اس

سلام دوستان خوبم  من به چه صورت میتونم ارتفاع div مربوط به header سایتم رو به اندازه ارتفاع صفحهwindow تغییر بدم ، به صورتی که header سایت در مانیتورهای مختلف به اندازه صفحه آن مانیتور resize شود؟  

پاسخ‌ها به این تاپیک
Insight
Insight
۱۳۹۴/۰۷/۲۴
با پیشرفت سی‌اس‌اس، واحدهای اندازه‌گیری دیگری با توجه به نیازهای روز ایجاد شد. دو مورد از این واحد ها که به کار سناریوی شما میاد، vh و vw هستن که به ترتیب مخفف viewport height و viewport width هستن. برای مثال، برای تعیین ارتفاع header یک وبسایت میتونید مقدار width رو برابر با 100vw (تمام عرض صفحه) و مقدار height رو برابر با 15vh قرار بدید تا با توجه به اندازه‌ی صفحه ی نمایش resize بشه (به تفاوت بین واحد % و vh دقت کنید)
ajorlou
ajorlou
۱۳۹۴/۰۷/۲۴
@media screen and (min-width: 480px) { div.header { height: 30px; } }

دوست من از با استفاده از دستوری شبیه کد بالا ابعادی رو که میخواید در سایز مورد نظرتون تعریف کنید