सीएसएस सहायता

Gmail पर भेजे गए ईमेल को स्टाइल करने के लिए, इनलाइन <style> ब्लॉक और स्टैंडर्ड सीएसएस का इस्तेमाल किया जा सकता है. ज़्यादातर सीएसएस सिलेक्टर, एट्रिब्यूट, और मीडिया-क्वेरी काम करती हैं. Gmail, सीएसएस की ऐसी प्रॉपर्टी और सिलेक्टर को अनदेखा कर सकता है जिनका इस्तेमाल नहीं किया जा सकता.

इस्तेमाल की जा सकने वाली सीएसएस प्रॉपर्टी और क्वेरी की पूरी सूची देखने के लिए, रेफ़रंस गाइड देखें.

सीएसएस सिलेक्टर

स्टाइल लागू करने के लिए, सीएसएस सिलेक्टर के सबसेट का इस्तेमाल किया जा सकता है. Gmail में क्लास, एलिमेंट, और आईडी सिलेक्टर काम करते हैं.

उदाहरण

<html>
  <head>
    <style>
      .colored {
        color: blue;
      }
      #body {
        font-size: 14px;
      }
    </style>
  </head>
  <body>
    <div id='body'>
      <p>Hi Pierce,</p>
      <p class='colored'>This text is blue.</p>
      <p>Jerry</p>
    </div>
  </body>
</html>

सीएसएस मीडिया क्वेरी

उपयोगकर्ता के मौजूदा डिवाइस के हिसाब से ईमेल की स्टाइल को अडजस्ट करने के लिए, स्टैंडर्ड सीएसएस मीडिया क्वेरी का इस्तेमाल किया जा सकता है. Gmail, स्क्रीन की चौड़ाई, ओरिएंटेशन, और रिज़ॉल्यूशन के हिसाब से क्वेरी करने की सुविधा देता है.

उदाहरण

<html>
  <head>
    <style>
      .colored {
        color: blue;
      }
      #body {
        font-size: 14px;
      }
      @media screen and (min-width: 500px) {
        .colored {
          color:red;
        }
      }
    </style>
  </head>
  <body>
    <div id='body'>
      <p>Hi Pierce,</p>
      <p class='colored'>
        This text is blue if the window width is
        below 500px and red otherwise.
      </p>
      <p>Jerry</p>
    </div>
  </body>
</html>

सीएसएस की ऐसी प्रॉपर्टी और क्वेरी जो कंपोज़िटर के साथ काम करती हैं

Gmail में इन सीएसएस प्रॉपर्टी का इस्तेमाल किया जा सकता है:

  • azimuth
  • बैकग्राउंड
  • background-blend-mode
  • पृष्ठभूमि-क्लिप
  • पृष्ठभूमि-रंग
  • पृष्ठभूमि-छवि
  • पृष्ठभूमि-मूल
  • पृष्ठभूमि-स्थान
  • पृष्ठभूमि-दोह
  • पृष्ठभूमि-आकार
  • बॉर्डर
  • बॉर्डर-निचला
  • बॉर्डर-निचला-रंग
  • बॉर्डर-निचला-बाईं-त्रिज्या
  • बॉर्डर-निचला-दाहिनी-त्रिज्या
  • बॉर्डर-निचला-शैली
  • बॉर्डर-निचला-चौड़ाई
  • बॉर्डर-संक्षिप्त
  • बॉर्डर-रंग
  • बॉर्डर-बायां
  • बॉर्डर-बायां-रंग
  • बॉर्डर-बायां-शैली
  • बॉर्डर-बायां-चौड़ाई
  • बॉर्डर-त्रिज्या
  • border-right
  • border-right-color
  • बॉर्डर-दाहिना-शैली
  • border-right-width
  • बॉर्डर-स्पेसिंग
  • बॉर्डर-शैली
  • बॉर्डर-शीर्ष
  • बॉर्डर-शीर्ष-रंग
  • बॉर्डर-शीर्ष-बाईं-त्रिज्या
  • बॉर्डर-शीर्ष-दाहिनी-त्रिज्या
  • बॉर्डर-शीर्ष-शैली
  • बॉर्डर-शीर्ष-चौड़ाई
  • बॉर्डर-चौड़ाई
  • box-sizing
  • break-after
  • break-before
  • break-inside
  • कैप्शन-किनारा
  • मिटाएं
  • रंग
  • column-count
  • column-fill
  • column-gap
  • column-rule
  • column-rule-color
  • column-rule-style
  • column-rule-width
  • column-span
  • column-width
  • कॉलम
  • दिशा
  • डिसप्ले
  • elevation
  • रिक्त-सेल
  • फ़्लोट
  • फ़ॉन्ट
  • फ़ॉन्ट-परिवार
  • font-feature-settings
  • font-kerning
  • फ़ॉन्ट-आकार
  • font-size-adjust
  • फ़ॉन्ट-तना
  • फ़ॉन्ट-शैली
  • font-synthesis
  • फ़ॉन्ट-विविधता
  • font-variant-alternates
  • font-variant-caps
  • font-variant-east-asian
  • font-variant-ligatures
  • font-variant-numeric
  • फ़ॉन्ट-भार
  • ऊंचाई
  • image-orientation
  • image-resolution
  • ime-mode
  • बीमार लोगों को स्वस्थ लोगों से अलग रखना
  • layout-flow
  • layout-grid
  • layout-grid-char
  • layout-grid-char-spacing
  • layout-grid-line
  • layout-grid-mode
  • layout-grid-type
  • अक्षर-स्पेसिंग
  • line-break
  • रेखा-ऊंचाई
  • सूची-शैली
  • सूची-शैली-स्थान
  • सूची-शैली-प्रकार
  • मार्जिन
  • निचली-मार्जिन
  • बाईं-मार्जिन
  • दाहिनी-मार्जिन
  • शीर्ष-मार्जिन
  • marker-offset
  • अधिकतम-ऊंचाई
  • अधिकतम-चौड़ाई
  • न्यूनतम-ऊंचाई
  • न्यूनतम-चौड़ाई
  • mix-blend-mode
  • object-fit
  • object-position
  • opacity
  • बाह्यरेखा
  • बाह्यरेखा-रंग
  • बाह्यरेखा-शैली
  • बाह्यरेखा-चौड़ाई
  • ओवरफ़्लो
  • ओवरफ़्लो-x
  • ओवरफ़्लो-y
  • पैडिंग
  • निचली-पैडिंग
  • बाईं-पैडिंग
  • दाहिनी-पैडिंग
  • शीर्ष-पैडिंग
  • page-break-after
  • page-break-before
  • page-break-inside
  • रोकें
  • pause-after
  • pause-before
  • पिच
  • pitch-range
  • उद्धरण
  • richness
  • बोलना
  • speak-header
  • speak-numeral
  • speak-punctuation
  • speech-rate
  • तनाव
  • तालिका-लेआउट
  • टेक्स्ट-संरेखण
  • text-align-last
  • text-autospace
  • text-combine-upright
  • टेक्स्ट-सज्जा
  • text-decoration-color
  • text-decoration-line
  • text-decoration-skip
  • text-decoration-style
  • text-emphasis
  • text-emphasis-color
  • text-emphasis-style
  • टेक्स्ट-इंडेंट
  • text-justify
  • text-kashida-space
  • text-orientation
  • टेक्स्ट-ओवरफ़्लो
  • टेक्स्ट-परिवर्तन
  • text-underline-position
  • unicode-bidi
  • लम्बवत-संरेखण
  • voice-family
  • व्हाइटस्पेस
  • चौड़ाई
  • शब्द-ब्रेक
  • शब्द-स्पेसिंग
  • शब्द-रैप
  • writing-mode
  • ज़ूम

मीडिया क्वेरी के लिए उपलब्ध सुविधाएं

इस तरह के कोड काम करते हैं

  • सभी
  • स्क्रीन

इन क्वेरी के लिए सुविधा उपलब्ध है

  • न्यूनतम-चौड़ाई
  • अधिकतम-चौड़ाई
  • min-device-width
  • max-device-width
  • ओरिएंटेशन
  • min-resolution
  • max-resolution

इस्तेमाल किए जा सकने वाले कीवर्ड

  • और
  • सिर्फ़ एक आइटम चुनें