توهان ڪئين سي ڊي ميڊيا سوالن کي ڪيئن لکي سگهو ٿا؟

منٽ جي چوٽي ۽ وڌ کان وڌ ميڊيا جي سوالن لاء ٻنهي نحو

قبول ويب ڊزائين ويب سائيٽون ٺاهڻ جي لاء هڪ طريقو آهي جتي انهن صفحن کي پنهنجي ترتيب ۽ نظر ثاني ڪندڙ جي اسڪرين جي سائيز جي بنياد تي تبديل ڪري سگهي ٿو. وڏيون اسڪرين کي انهن وڏين ڊسپلي سان مناسب هڪ ترتيب حاصل ڪري سگهن ٿيون جڏهن ننڍا ڊوائيس، جهڙوڪ موبائل فون، انهي ساڳئي ويب سائيٽ کي انهي طريقي سان نموني حاصل ڪري سگهو ٿا جيڪي ننڍا اسڪرين لاء مناسب آهن. اهو طريقو سڀني صارفين لاء بهتر صارف تجربو مهيا ڪري ٿو ۽ اهو پڻ سرچ انجن جي درجه بندي کي بهتر ڪرڻ ۾ مدد ڪري سگھي ٿو. قبول ويب ڊيزائن جو هڪ اهم حصو سي ڊي ميڊيا سوالن جو آهي.

ميڊيا سوالون توهان جي ويب سائيٽ جي سي ايس ڊي جي اندر ٿوري شرطي بيانن وانگر آهي، توهان کي ڪجهه سي ايس ايس سيٽ سيٽ ڪرڻ جي اجازت ڏئي ٿي جيڪا صرف هڪ خاص شرطن سان هڪ ڀيرو پورو ٿئي ٿي. جهڙوڪ اسڪرين جي سائز ڪجهه حد کان مٿي يا هيٺ ڏنل هوندو.

عمل ۾ ميڊيا سوالون

پوء توهان ويب سائيٽ تي ميڊيا سوالون ڪيئن استعمال ڪندا آهيو؟ هتي هڪ بلڪل مثال آهي:

  1. توهان ڪنهن به جوڙجڪ HTML دستاويزن سان شروع ڪندي ڪنهن به منظر اندازن مان آزاد ڪنديون آهن (اهو ڇا آهي ايس ايس ڊي لاء آهي)
  2. توهان جي سي ايس ايس ڊي فائيل ۾، توهان کي عام طور تي صفحي کي اسٽائل ڪندي ڪم ڪرڻ شروع ڪيو ۽ ويب سائيٽ ڪيئن نظر اينديون لاء هڪ بيس لائين قائم ڪندي. چوندا آهن ته توهان صفحن جي فانٽ سائيز چاهين ته 16 پکسلز هجڻ گهرجي، توهان هن سي ايس لکي سگهو ٿا: جسم {font-size: 16px؛ }
  3. هاڻي، توهان کي انهي فونٽ جي سائيز لاء وڏين اسڪرين لاء وڌائڻ چاهيندا آهن جيڪي غير معمولي ريٽ اسٽيٽ کي ائين ڪرڻ لاء آهن. اهو ڪٿي آهي ميڊيا سوالن ۾ لت هڻي. توهان هن کي ميڊيا ڪوڙي شروع ڪري ڇڏي ها:media اسڪرين ۽ (منٽ-چوڪ: 1000px) {}
  4. هي ميڊيا سوالن جي نحو آهي. اهو شروع ٿئي ٿوmedia سان پاڻ کي ميڊيا سوالات قائم ڪرڻ لاء. اڳيون توهان "ميڊيا قسم" قائم ڪيو، جنهن ۾ هن معاملي ۾ "اسڪرين" آهي. هي ڊيسڪ ٽاپ اسڪرين اسڪرين، ٽيبليٽس، فونز وغيره وغيره تي لاڳو ٿئي ٿو، آخرڪار، توهان ميڊيا جي سوال کي "ميڊيا جي خاصيت" سان ختم ڪري سگهو ٿا. اسان جي مٿئين مثال ۾، اهو آهي "ڏهين چوٽي: 1000px". هن جو مطلب اهو آهي ته ميڊيا سوال تقريبا ڊيگهه 1000 ڪلو پکسل ويڪر جي ڏيکاري ڏيکاري ٿو.
  1. ميڊيا سوال جي هنن عناصرن کان پوء، توهان هڪ نئين افتتاح ۽ بند ڪرڻ سان جڙي ڪنگڻ سان گڏوگڏ هر ڪنهن عام سي ايس جي اصول ۾ ڇا ڪيو.
  2. ميڊيا سوال ڪرڻ لاء فائنل قدم اهو شرط آهي ميٽ ڪرڻ سي ايس جي قاعدي جيڪو توهان درخواست ڪرڻ چاهيندا آهن. توهان جئين برائوز برادس جي وچ ۾ اهي سي ڊي قاعدن شامل ڪندا آهن جيڪي ميڊيڪل سوال سان ٺاهيندا آهن، جهڙوڪ:media اسڪرين ۽ (منڊل: 1000px) {body {font-size: 20px؛ }
  3. جڏهن ميڊيا جون حالتون پوريون ٿينديون آهن (برائوزر ونڊوز گهٽ ۾ گهٽ 1000 پکسلز ويڪر آهي)، هي سي ايس اسڪرين جو اثر پوي ٿو، اسان جي سائيٽ جي فٽٽ ۾ تبديل ڪري 16 پکسلز کان اسان کي اصل ۾ 20 پکسلز جي اسان جي نئين قيمت تي قائم آهي.

وڌيڪ طرز شامل ڪرڻ

توهان هن ميڊيا ۾ ڪيتريون ئي ايس ايس ڊي قاعدن کي جاء ڪري سگهو ٿا سوالو پنهنجي ويب سائيٽ جي بصري ظهور کي ترتيب ڏيڻ لاء گهربل آهي. مثال طور، جيڪڏهن توهان چاهيندا ته فائيل سائيز صرف 20 پکسلز کي وڌائي، پر ڪارو جي سڀني پيراگراف جي رنگ (# 000000) کي به تبديل ڪري، توهان هن کي شامل ڪري سگھو ٿا:

@ ايم ايلڊ اسڪرين ۽ (منٽ جي ڊيگهه: 1000px) {جسم {font-size: 20px؛ } p {رنگ: # 000000؛ }}

وڌيڪ ميڊيا سوالن کي شامل ڪرڻ

اضافي طور تي، توهان هر هر وڏين سائز لاء وڌيڪ ميڊيا سوالن کي شامل ڪري سگهو ٿا، انهي کي پنهنجي انداز ۾ شامل ڪري سگهو ٿا:

@ ايم ايلڊ اسڪرين ۽ (منٽ جي ڊيگهه: 1000px) {جسم {font-size: 20px؛ } p {رنگ: # 000000؛ {} @ ميڊيڪل اسڪرين ۽ (منٽ وارا: 1400px) {جسم {فائيل-سائيٽ: 24px؛ }}

پهريون ميڊيا سوالون، 1000 پکسلز ويڪر ۾ لت هوندا ها، فونٽ جي شڪل کي تبديل ڪرڻ ۾ 20 پکسلز. انهي کان پوء، هڪ ڀيرو برائوزر 1400 پکسلز کان مٿي هوندو هو، فونٽ جي شڪل ۾ 24 پکسلز تبديل ٿي ويندو. توهان پنهنجي خاص ويب سائيٽ جي گهربل طور تي ڪيترائي ميڊيا سوالون شامل ڪري سگهو ٿا.

ننڍي چوٿون ۽ وڌ ۾ وڌ ويڪر

عام طور تي ميڊيا سوالن لکڻ لاء ٻه طريقا آهن - "منٽ چوٽي" استعمال ڪندي يا "وڌ کان وڌ" سان. ايترو پري، اسان عمل ۾ "مونجهار" ڏٺو آهي. اهو ميڊيا جي سوالن کي هڪڙي اثر انداز ڪرڻ جو سبب بنائي ٿو ته هڪ برائوزر گهٽ ۾ گهٽ گھٽ ۾ گهٽ چوڪائي پهچي وئي آهي. تنهنڪري هڪ سوال جيڪو استعمال ڪري ٿو "منٽ-چوڪ: 1000px" لاڳو ٿيندو جڏهن برائوزر گھٽ ۾ گهٽ 1000 پکسلز وڏن هوندي آهي. هي ميڊيا ميڊيا سوال جو استعمال ڪيو ويندو آهي جڏهن توهان "موبائل-پهريون" انداز ۾ سائيٽ جي تعمير ڪندا آهيو.

جيڪڏهن توهان "وڌ کان وڌ وارو" استعمال ڪندا آهيو، انهي جي سامهون طريقي سان ڪم ڪندو آهي. هڪ ميڊيا سوال "وڌ کان وڌ: 1000px" لاڳو ٿئي ٿي ته برائوزر هن سائيز هيٺان گرام ٿي چڪو آهي.

پراڻين برائوزر جي حوالي سان

ميڊيا سوالن سان گڏ هڪ چئلينج انٽرنيٽ ايڪسپلورر پر پراڻا ورزن ۾ سپورٽ جي گهمڻ آهي. مھرباني ڪري، اھي موجود آھن اھي موجود آھن جيڪي انھن پراڻين برائوزرن ۾ ميڊيا سوالن جي لاء مدد ڪري سگھندا آھن، توھان کي توھان کي انھن ويب سائيٽن تي استعمال ڪرڻ جي اجازت ڏئي ٿو، جڏهن ته اڃا انهي کي يقيني بڻائڻ ته ته سائيٽ جي ڊسپلي پراڻين برائوزر سافٽ ويئر ۾ ڪٽ نه ٿي اچي.

1/24/17 تي Jeremy Girard پاران ڏنل