الصفحة الرئيسية
تحميل الكود
تغيير الألوان
تغيير العرض
تغيير حجم العرض
تشغيل الكود
<!DOCTYPE html> <html> <head> <style> h1 { font-size: 1.8rem; } @media (min-width: 768px) { h1 { font-size: 2.2rem; } } @media (min-width: 960px) { h1 { font-size: 2.6rem; } } </style> </head> <body> <h1>Initial Values And Multiple Media Query</h1> <p>If no condition is true, 1.8rem will be used as font-size for H1 because this is the default value.</p> <p>If min-width is 768px, then 2.2rem will be used font-size for H1.</p> <p>If min-width is 960px, then 2.6rem will be used font-size for H1.</p> <p>Resize the screen to notice the padding change.</p> </body> </html>
الصفحة الرئيسية
تحميل الكود
تغيير الألوان
تغيير العرض
تغيير حجم العرض
تشغيل الكودالصفحة الرئيسيةتحميل الكودتغيير الألوانتغيير العرضتغيير حجم العرضتشغيل الكود