تغییر سایز فونت وب سایت بصورت داینامیک بر اساس رزولوشن صفحه

0 رأی
میانگین بازدید روزانه 0.41989 بازدید

می خواهم فونت وب سایتی که درست کرده ام بر اساس رزولوشن صفحه نمایش بزرگ یا کوچک شود که خوانایی بالاتری داشته باشد. برای تشخیص رزولوشن از @media در CSS هام استفاده کرده ام ولی نمی خواهم برای هر رزولوشن یک فونت سایز بدهم چون خیلی زیاد می شود.

سوال 6 سال قبل در تالار برنامه نویسی توسط sina-z (1,302 امتیاز)
چه زبانی استفاده می کنید ؟

می تونی یک کلاس فونت تعریف کنی بعد خروجی رو در فونت سایز بزاری مهم نیست بگزریم فقط سوالتو واضحتر بگو سینا جان
از PHP استفاده می کنم.

2 جواب

+1 رأی

من یک راه حل ساده دارم. ابتدا در فایل css خود هر جا که می خواهید به خصوصیت font-size مقدار بدهید از em استفاده کنید.

در css اصلی با استفاده از رول html درصد font-size در حالت پیش فرض را مشخص کنید:

html { font-size: 100%; }
.site-header { font-size: 1em;}
.site-content { font-size: 1.1em;}

حالا با رول @media برای هر رزولوشن فقط مشخص کنید که تمام مقادیر فونت سایت چقدر کوچک یا بزرگ شود:

@media (max-width: 300px) {
    html { font-size: 70%; }
}

@media (min-width: 500px) {
    html { font-size: 80%; }
}

@media (min-width: 700px) {
    html { font-size: 120%; }
}

@media (min-width: 1200px) {
    html { font-size: 200%; }
}
جواب 6 سال قبل توسط Saeed Zarinfam (737 امتیاز)
+1 رأی

سلام اولین راه حل استفاده از علامت % است اینطور

 

نام ایدی یا کلاس{ font-size:100%; }

 این علامت با توجه به فضای که در صفحه دارد بصورت داینامیکی تغییر می کند.

ولی راه حل دوم اینکه با استفاده از جاوا اسکریپت و پی اچ پی که خودم به شخصه همچین کار نمی کنم چون اگر یک کاربر یا کاربرانی که به سایت میان کافیه که جاوا اسکریپت اونها غیر فعال که کاربر رو از محیط  زده می کنه که نظر کارهای رو باید با javaScript انجام داد به طور مشهود نباشد همیشه باید دور از دید کاربر و همیشه باید از تگ noscript بعد از script استفاده کرد خوب بریم به سراغ اینکه چطور اینکار رو انجام بدیم اول از همه نام id , class رو در تگ style قراردااده مثال :

  ""echo

جواب 6 سال قبل توسط hosseini (1,852 امتیاز)
ویرایش 6 سال قبل توسط hosseini

سوال های مشابه

0 رأی
1 جواب میانگین بازدید روزانه 0.09174 بازدید
+1 رأی
2 جواب میانگین بازدید روزانه 0.792,280 بازدید
0 رأی
0 جواب میانگین بازدید روزانه 0.1174 بازدید
0 رأی
1 جواب میانگین بازدید روزانه 0.36503 بازدید
0 رأی
1 جواب میانگین بازدید روزانه 0.25537 بازدید
+3 رأی
1 جواب میانگین بازدید روزانه 0.551,475 بازدید
سوال 7 سال قبل در تالار برنامه نویسی توسط Saeed Zarinfam (737 امتیاز)
0 رأی
1 جواب میانگین بازدید روزانه 0.13294 بازدید
0 رأی
1 جواب میانگین بازدید روزانه 0.872,447 بازدید
0 رأی
1 جواب میانگین بازدید روزانه 0.1278 بازدید
0 رأی
0 جواب میانگین بازدید روزانه 0.0472 بازدید
کانال تلگرام جواب یاب
...