المرشح inline_css في Twig
< Twig
اذهب إلى التنقل
اذهب إلى البحث
مراجعة 15:07، 11 مايو 2021 بواسطة عبد اللطيف ايمش (نقاش | مساهمات)
المرشح inline_css يضع أنماط CSS في مستندات HTML:
{% apply inline_css %}
<html>
<head>
<style>
p { color: red; }
</style>
</head>
<body>
<p>Hello CSS!</p>
</body>
</html>
{% endapply %}
تضاف بعض أنماط CSS بتمريرها كوسائط إلى المرشح:
{% apply inline_css(source("some_styles.css"), source("another.css")) %}
<html>
<body>
<p>Hello CSS!</p>
</body>
</html>
{% endapply %}
كذلك فإن الأنماط التي حمّلها المرشح تتخطى الأنماط المعرفة في وسم <style> في مستند HTML، ويمكن استخدام المرشح على ملف مدرَج أيضًا كما يلي:
{{ include('some_template.html.twig')|inline_css }}
{{ include('some_template.html.twig')|inline_css(source("some_styles.css")) }}
تعمل أداة CSS inliner على مستند HTML كله، وليس جزءًا منه فقط.
لاحظ أن المرشح inline_css جزء من CssInlinerExtension وهذا لا يكون مثبتًا افتراضيًا، لذا ثبته أولًا:
$ composer require twig/cssinliner-extra
ثم ثبت twig/extra-bundle في حالة مشاريع Symfony:
$ composer require twig/extra-bundle
أما غير ذلك فأضف التوسيع صراحة إلى بيئة Twig:
use Twig\Extra\CssInliner\CssInlinerExtension;
$twig = new \Twig\Environment(...);
$twig->addExtension(new CssInlinerExtension());