प्रत्येक कंप्यूटर/मोबाइल [वर्डप्रेस] के लिए सीएसएस कैसे लागू करें

2019 7 年 月 日 10

यह स्थिति मानकर

  • मैं केवल कंप्यूटर/मोबाइल स्क्रीन पर सीएसएस को प्रतिबिंबित करना चाहता हूं
  • मैंने अतिरिक्त सीएसएस के साथ डिज़ाइन को बदल दिया, लेकिन यह स्मार्टफोन पर गिर गया
  • मैं ऐसे पैडिंग और मार्जिन सेट करना चाहता हूं जो स्मार्टफोन/टैबलेट/पीसी जैसे उपकरणों से मेल खाते हों
  • आप जितनी सीएसएस लागू करना चाहते हैं, वह उतनी नहीं है

विधि

बस "@मीडिया स्क्रीन" दर्ज करें, उस डिवाइस की स्क्रीन चौड़ाई निर्दिष्ट करें जिसे आप "और ()" से प्रतिबिंबित करना चाहते हैं, और "{}" में सीएसएस कोड दर्ज करें। 

  • केवल पीसी को प्रतिबिंबित करें
@मीडिया स्क्रीन और (न्यूनतम-चौड़ाई: 980 पीएक्स) { यहां सीएसएस दर्ज करें} 
  • केवल टैबलेट को प्रतिबिंबित करें
@मीडिया स्क्रीन और (न्यूनतम-चौड़ाई: 481पीएक्स) और (अधिकतम-चौड़ाई: 979पीएक्स) {यहां सीएसएस दर्ज करें} 
  • केवल मोबाइल को प्रतिबिंबित करें
@मीडिया स्क्रीन और (अधिकतम-चौड़ाई: 480px) { CSS यहां दर्ज करें } 
  • पीसी और टैबलेट केवल या टैबलेट और मोबाइल ही
/* डेस्कटॉप और टैबलेट */ @मीडिया स्क्रीन और (मिश्रण-चौड़ाई: 481पीएक्स){ सीएसएस यहां} /* टैबलेट और मोबाइल */ @मीडिया स्क्रीन और (अधिकतम-चौड़ाई: 980पीएक्स) {सीएसएस यहां} 

"अधिकतम-चौड़ाई: 480px" का अर्थ है कि स्क्रीन की चौड़ाई है480 पीएक्स तक के उपकरण = 480 पीएक्स या उससे कमस्मार्टफोन, आदि

विपरीतता से"न्यूनतम-चौड़ाई: 980px"दांत,न्यूनतम 980 पीएक्स = 980 पीएक्स या अधिकमेरा कंप्यूटर स्क्रीन की चौड़ाई जैसा लगता है।

  • पीसी और टैबलेट केवल

स्क्रीन की चौड़ाई निम्न पर आधारित होती है, जो अधिकांश उपकरणों पर लागू होती है।

स्मार्टफोन : 480 पीएक्स या उससे कम
गोली : 768~980पीएक्स
पीसी: 980 पीएक्स या अधिक

संदर्भ: स्क्रीन की चौड़ाई

यहां तक ​​कि एक स्मार्टफोन के साथ, अगर आप इसे साइड में रखते हैं, तो यह 480 पिक्सल से अधिक होगा।एक निजी कंप्यूटर पर भी, यदि यह केवल आधे स्क्रीन पर प्रदर्शित होता है, तो यह एक टैबलेट की चौड़ाई होगी।

IPhone पर, निम्न छवियों को स्क्रीन आकार के संदर्भ के रूप में उपयोग किया जा सकता है। CSS में स्क्रीन की चौड़ाई होती हैपीएक्स (पिक्सेल)लेकिन डिवाइस की तरफअंककृपया ध्यान दें कि इसे के रूप में व्यक्त किया गया है।

छवि: उद्धृत स्रोत द अल्टीमेट गाइड टू आईफोन रेजोल्यूशन

उदाहरण के लिए, आईफोन एक्स
बिंदु: 375 x 812
पिक्सल: 1125 x 2436

हालाँकि, CSS द्वारा निर्दिष्ट चौड़ाई 375 है।