钩子文档

safe_style_css

💡 云策文档标注

概述

safe_style_css 是一个 WordPress 过滤器,用于控制允许的 CSS 属性列表,以增强内容安全性。开发者可以通过此 Hook 自定义或扩展允许的 CSS 属性,确保在过滤内联样式时仅保留安全的样式规则。

关键要点

  • safe_style_css 是一个过滤器,参数为数组 $attr,用于定义允许的 CSS 属性。
  • 默认包含大量 CSS 属性,如背景、边框、字体、布局、Flexbox、Grid 等,以及自定义属性 '--*'。
  • 主要用于 safecss_filter_attr() 函数中,过滤内联样式并移除不允许的规则。
  • 自 WordPress 2.8.1 版本引入,是 kses 安全系统的一部分。

代码示例

$allowed_attr = apply_filters(
    'safe_style_css',
    array(
        'background',
        'color',
        'font-size',
        // 更多属性...
        '--*',
    )
);

注意事项

  • 修改此过滤器时需谨慎,避免引入不安全的 CSS 属性,可能导致安全漏洞。
  • 自定义属性 '--*' 允许所有 CSS 自定义属性,但需确保其使用符合安全标准。
  • 此过滤器与 safecss_filter_attr() 函数紧密相关,用于实际过滤操作。

📄 原文内容

Filters the list of allowed CSS attributes.

Parameters

$attrstring[]
Array of allowed CSS attributes.

Source

$allowed_attr = apply_filters(
	'safe_style_css',
	array(
		'background',
		'background-color',
		'background-image',
		'background-position',
		'background-repeat',
		'background-size',
		'background-attachment',
		'background-blend-mode',

		'border',
		'border-radius',
		'border-width',
		'border-color',
		'border-style',
		'border-right',
		'border-right-color',
		'border-right-style',
		'border-right-width',
		'border-bottom',
		'border-bottom-color',
		'border-bottom-left-radius',
		'border-bottom-right-radius',
		'border-bottom-style',
		'border-bottom-width',
		'border-bottom-right-radius',
		'border-bottom-left-radius',
		'border-left',
		'border-left-color',
		'border-left-style',
		'border-left-width',
		'border-top',
		'border-top-color',
		'border-top-left-radius',
		'border-top-right-radius',
		'border-top-style',
		'border-top-width',
		'border-top-left-radius',
		'border-top-right-radius',

		'border-spacing',
		'border-collapse',
		'caption-side',

		'columns',
		'column-count',
		'column-fill',
		'column-gap',
		'column-rule',
		'column-span',
		'column-width',

		'color',
		'filter',
		'font',
		'font-family',
		'font-size',
		'font-style',
		'font-variant',
		'font-weight',
		'letter-spacing',
		'line-height',
		'text-align',
		'text-decoration',
		'text-indent',
		'text-transform',
		'white-space',

		'height',
		'min-height',
		'max-height',

		'width',
		'min-width',
		'max-width',

		'margin',
		'margin-right',
		'margin-bottom',
		'margin-left',
		'margin-top',
		'margin-block-start',
		'margin-block-end',
		'margin-inline-start',
		'margin-inline-end',

		'padding',
		'padding-right',
		'padding-bottom',
		'padding-left',
		'padding-top',
		'padding-block-start',
		'padding-block-end',
		'padding-inline-start',
		'padding-inline-end',

		'flex',
		'flex-basis',
		'flex-direction',
		'flex-flow',
		'flex-grow',
		'flex-shrink',
		'flex-wrap',

		'gap',
		'column-gap',
		'row-gap',

		'grid-template-columns',
		'grid-auto-columns',
		'grid-column-start',
		'grid-column-end',
		'grid-column',
		'grid-column-gap',
		'grid-template-rows',
		'grid-auto-rows',
		'grid-row-start',
		'grid-row-end',
		'grid-row',
		'grid-row-gap',
		'grid-gap',

		'justify-content',
		'justify-items',
		'justify-self',
		'align-content',
		'align-items',
		'align-self',

		'clear',
		'cursor',
		'direction',
		'float',
		'list-style-type',
		'object-fit',
		'object-position',
		'opacity',
		'overflow',
		'vertical-align',
		'writing-mode',

		'position',
		'top',
		'right',
		'bottom',
		'left',
		'z-index',
		'box-shadow',
		'aspect-ratio',
		'container-type',

		// Custom CSS properties.
		'--*',
	)
);

Changelog

Version Description
2.8.1 Introduced.