ميزات CSS المدعومة في AMP للبريد الإلكتروني
يوضح هذا المستند ميزات CSS المدعومة حاليًا داخل رسائل AMP الإلكترونية.
تطبيق CSS
صفحة الأنماط الداخلية
عند استخدام صفحة أنماط داخلية، يتم تحديد CSS داخل علامة <style amp-custom> والتي توجد في علامة <head> للبريد الإلكتروني.
الأنماط المدمجة
بالإضافة إلى صفحة الأنماط الداخلية، يمكن تحديث أنماط مدمجة على أي عنصر باستخدام السمة style.
صفحة الأنماط الخارجية
صفحات الأنماط الخارجية غير مدعومة في AMP للبريد الإلكتروني.
ولا يُسمح باستخدام <link rel="stylesheet" href="..."> في أي مكان في البريد الإلكتروني.
محددات CSS المدعومة
المحددات البسيطة
- محدد النوع
elementname - محدد الفئة
.classname - محدد المعرف
#idname - محدد عمومي
* - محدد السمة
[attr=value]
وحدات التجميع
- وحدة تجميع تابع مجاور
A + B - وحدة تجميع تابع عام
A ~ B - وحدة تجميع فرعية
A > B - وحدة تجميع تبعية
A B
فئات صورية
:active:checked:default:disabled:empty:enabled:first-child:first-of-type:focus:focus-within:hover:in-range:indeterminate:invalid:last-child:last-of-type:last-of-type:not:nth-child:nth-last-child:nth-last-of-type:nth-of-type:only-child:only-of-type:optional:out-of-range:read-only:read-write:required:valid
خواص CSS المدعومة
-moz-appearance-webkit-appearance-webkit-tap-highlight-coloralign-contentalign-itemsalign-selfappearanceazimuthbackgroundbackground-attachmentbackground-blend-modebackground-clipbackground-colorbackground-imagebackground-originbackground-positionbackground-repeatbackground-sizeborderborder-bottomborder-bottom-colorborder-bottom-left-radiusborder-bottom-right-radiusborder-bottom-styleborder-bottom-widthborder-collapseborder-colorborder-leftborder-left-colorborder-left-styleborder-left-widthborder-radiusborder-rightborder-right-colorborder-right-styleborder-right-widthborder-spacingborder-styleborder-topborder-top-colorborder-top-left-radiusborder-top-right-radiusborder-top-styleborder-top-widthborder-widthbottombox-shadowbox-sizingbreak-afterbreak-beforebreak-insidecaption-sidecaret-colorclearcolorcolor-adjustcolumn-countcolumn-fillcolumn-gapcolumn-rulecolumn-rule-colorcolumn-rule-stylecolumn-rule-widthcolumn-spancolumn-widthcolumnscounter-incrementcounter-resetcursordirectiondisplayelevationempty-cellsfilterflexflex-basisflex-directionflex-flowflex-growflex-shrinkflex-wrapfloatfontfont-familyfont-feature-settingsfont-kerningfont-sizefont-size-adjustfont-stretchfont-stylefont-synthesisfont-variantfont-variant-alternatesfont-variant-capsfont-variant-east-asianfont-variant-ligaturesfont-variant-numericfont-variation-settingsfont-weightgapgridgrid-areagrid-auto-columnsgrid-auto-flowgrid-auto-rowsgrid-columngrid-column-endgrid-column-startgrid-rowgrid-row-endgrid-row-startgrid-templategrid-template-areasgrid-template-columnsgrid-template-rowsheighthyphensimage-orientationimage-resolutioninline-sizeisolationjustify-contentjustify-itemsjustify-selfleftletter-spacingline-breakline-heightlist-stylelist-style-positionlist-style-typemarginmargin-bottommargin-leftmargin-rightmargin-topmax-heightmax-widthmin-heightmin-widthmix-blend-modeobject-fitobject-positionoffset-distanceopacityorderoutlineoutline-coloroutline-offsetoutline-styleoutline-widthoverflowoverflow-xoverflow-yoverflow-wrappaddingpadding-bottompadding-leftpadding-rightpadding-toppausepause-afterpause-beforeperspectiveperspective-originpitchpitch-rangeplace-itemspositionquotesresizerichnessrightrow-gapspeakspeak-headerspeak-numeralspeak-punctuationspeech-ratestresstable-layouttext-aligntext-align-lasttext-combine-uprighttext-decorationtext-decoration-colortext-decoration-linetext-decoration-skiptext-decoration-styletext-emphasistext-emphasis-colortext-emphasis-positiontext-emphasis-styletext-indenttext-justifytext-orientationtext-overflowtext-shadowtext-transformtext-underline-positiontoptransformtransform-boxtransform-origintransform-styletransitiontransition-delaytransition-durationtransition-propertytransition-timing-functionunicode-bidivertical-alignvisibilityvoice-familywhite-spacewidthword-breakword-spacingword-wrapwriting-modez-index
القيود الإضافية
تتضمن خواص CSS التالية خواصًا إضافية:
| الخاصية | القيود |
|---|---|
cursor |
القيم المسموح بها هي pointer وinitial فقط. |
filter |
غير مسموح بـ url(). |
transition |
يمكن عمل رسوم متحركة لـ opacity وtransform وvisibility وoffset-distance فقط. |
visibility |
القيم المسموح بها هي hidden وvisible وinitial فقط. |
z-index |
القيم فقط بين -100 و100 غير مسموح بها. |
قواعد At
قاعدةat الوحيدة المدعومة حاليًا هي @media. راجع ميزات الوسائط لمزيد من المعلومات.
الخطوط المخصصة (@font-face)
الخطوط المدعومة غير مدعومة في AMP للبريد الإلكتروني.
ميزات الوسائط
قائمة ميزات الوسائط المدعومة لتطبيق القواعد المشروط عن طريق استعلامات @media.
device-widthmax-device-widthmin-device-widthhoverorientationpointerresolutionmax-resolutionmin-resolutionwidthmax-widthmin-width