इस पेज का अनुवाद Cloud Translation API से किया गया है.

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

आप इनलाइन <style> ब्लॉक और स्टैंडर्ड सीएसएस का इस्तेमाल करके, Gmail को भेजे गए ईमेल को स्टाइल कर सकते हैं. ज़्यादातर सीएसएस सिलेक्टर, एट्रिब्यूट, और मीडिया क्वेरी का इस्तेमाल किया जा सकता है. 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
background-clip
background-color
पृष्ठभूमि-छवि
पृष्ठभूमि-मूल
background-position
background-repeat
background-size
border
border-bottom
border-bottom-color
border-bottom-left-radius
border-bottom-right-radius
बॉर्डर-निचला-शैली
border-bottom-width
border-collapse
border-color
border-left
border-left-color
border-left-style
border-left-width
border-radius
border-right
border-right-color
border-right-style
border-right-width
border-spacing
border-style
border-top
border-top-color
border-top-left-radius
border-top-right-radius
border-top-style
border-top-width
border-width
box-sizing
ब्रेक के बाद
ब्रेक से पहले
ब्रेक-इनसाइड
caption-side
मिटाएं
रंग
कॉलम की संख्या
कॉलम-फ़िल
कॉलम-गैप
कॉलम-नियम
कॉलम-नियम-रंग
कॉलम-नियम की शैली
कॉलम-नियम की चौड़ाई
कॉलम-स्पैन
कॉलम की चौड़ाई
कॉलम
direction
display
elevation
empty-cells
float
फ़ॉन्ट
font-family
font-feature-settings
font-kerning
font-size
font-size-adjust
font-stretch
font-style
font-synthesis
font-variant
font-variant-alternates
font-variant-caps
font-variant-east-asian
font-variant-ligatures
font-variant-numeric
font-weight
ऊंचाई
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
letter-spacing
line-break
line-height
list-style
list-style-position
list-style-type
margin
margin-bottom
बाईं-मार्जिन
दाहिनी-मार्जिन
margin-top
marker-offset
max-height
max-width
न्यूनतम-ऊंचाई
min-width
mix-blend-mode
object-fit
object-position
opacity
outline
outline-color
outline-style
outline-width
overflow
overflow-x
overflow-y
padding
padding-bottom
padding-left
padding-right
padding-top
पेज-ब्रेक-बाद
पेज-ब्रेक-पहले
पेज-ब्रेक-इन-साइड
रोकें
pause-after
pause-before
पिच
pitch-range
quotes
richness
बोलना
speak-header
speak-numeral
speak-punctuation
speech-rate
तनाव
table-layout
text-align
text-align-last
text-autospace
text-combine-upright
text-decoration
text-decoration-color
text-decoration-line
text-decoration-skip
text-decoration-style
text-emphasis
text-emphasis-color
text-emphasis-style
text-indent
text-justify
text-kashida-space
text-orientation
text-overflow
text-transform
text-underline-position
unicode-bidi
vertical-align
voice-family
white-space
width
शब्द-ब्रेक
word-spacing
word-wrap
writing-mode
ज़ूम

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

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

सभी
स्क्रीन

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

min-width
max-width
डिवाइस की कम से कम चौड़ाई
max-device-width
स्क्रीन की दिशा
कम से कम रिज़ॉल्यूशन
max-resolution

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

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