जीथब मार्कडाउन छवियों के लिए डार्क मोड

मार्कडाउन में लाइट या डार्क मोड के लिए अलग-अलग इमेज का उपयोग कैसे करें

छवियों के लिए डार्क मोड

यदि आप रंग योजना द्वारा जीथब मार्कडाउन में अपनी मीडिया संपत्तियों को अलग करना चाहते हैं, तो सिंटैक्स का अपडेट अब इसे संभव बनाता है।

अब तक, आप मार्कडाउन दुभाषिया को अपने भंडार या दूरस्थ गंतव्य से छवियों को प्रस्तुत करने के निर्देश देने के लिए आईएमजी-टैग का उपयोग कर सकते हैं। अपनी छवियों के साथ डार्क मोड के अनुकूल होने के लिए, अब आप अधिक आधुनिक HTML चित्र-टैग का भी उपयोग कर सकते हैं।

जीथब मार्कडाउन को डार्क मोड में कैसे अनुकूलित करें

निम्नलिखित कोड उदाहरण दिखाता है कि उपयोगकर्ता की पसंदीदा रंग योजना, यानी डार्क या लाइट मोड के आधार पर किसी छवि के लिए दो वेरिएंट कैसे शामिल करें। सिंटैक्स HTML5 और CSS के बराबर है।

<!--
 Note we're using the same HTML-sytnax for
 constraint-based assets as you would do on 
 the web.
-->

<picture>
  <source media="(prefers-color-scheme: dark)" srcset="https://path-to-your-dark-mode-image.webp">
  <img alt="A single image caption for both variants" src="https://path-to-default-light-mode-image.webp">
</picture>

जैसा कि आप देख सकते हैं, कुछ बदलावों के साथ, आपकी छवियां अब डार्क मोड के लिए भी अनुकूल हो सकती हैं। जैसा कि सामान्य मार्कडाउन तत्व पहले से ही पूरी तरह से डार्क मोड का समर्थन कर रहे हैं, आपको कुछ भी करने की आवश्यकता नहीं है, यह जीथब मार्कडाउन की क्षमताओं के लिए एक स्वागत योग्य अतिरिक्त है।

सुझाव

संबंधित

परिशिष्ट

भाषाएँ