README

解析给定的CSS样式并将其应用到HTML元素上。嵌入通常在新闻邮件中需要 - 使用内联样式，它应该在任何浏览器/客户端中看起来都很好，而且你不必维护样式杂乱无章 :)

由于CSS嵌入到style属性中，因此不支持伪选择器（:hover,:nth-child等）。

你可以使用任何CSS选择器组合。多个选择器将被应用到单个元素上，并考虑CSS选择器特定性，因此你可以写

* { color: red; }
#myId { color: blue; }

如何安装

将要求添加到composer.json中

{
    "require": {
        "glorpen/style-embedder-bundle": "@dev"
    }
}

在您的AppKernel类中启用插件

app/AppKernel.php

<?php

class AppKernel extends AppKernel
{
   public function registerBundles()
   {
       $bundles = array(
           ...
           new Glorpen\StyleEmbedderBundle\GlorpenStyleEmbedderBundle(),
           ...
       );
   }
}

用法

使用Twig渲染

模板

{% block style %}
   .footer * {
      color: silver;
   }
  .footer p {
      font-weight: bold;
   }
   .footer p > span {
      font-weight: normal;
   }
   h1 {
      font-size: 20px;
   }
{% endblock %}
{% block html %}
<html>
   <head></head>
   <body>
      <h1>Some Header</h1>
      <div class="footer">
         <p>Address: <span>Our address</span></p>
         <p>Tel.: <span>123-456-789</span></p>
      </div>
   </body>
</html>
{% endblock %}

渲染

<?php

$embedder = $container->get("glorpen.style_embedder")
$ret = $embedder->render('template.html.twig');

你会得到

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/REC-html40/loose.dtd">
<html><head></head><body>
   <h1 style="font-size:20px;">Some Header</h1>
   <div class="footer">
      <p style="color:silver;font-weight:bold;">Address: <span style="color:silver;font-weight:normal;">Our address</span></p>
      <p style="color:silver;font-weight:bold;">Tel.: <span style="color:silver;font-weight:normal;">123-456-789</span></p>
   </div>
</body></html>

简单渲染

嵌入器也可以处理纯数据。

<?php

$styles = '* { font-weight: bold; }';
$html = ' .... ';

$embedder = $container->get("glorpen.style_embedder")
$ret = $embedder->embed($styles, $html);

glorpen / style-embedder-bundle

维护者

详细信息

README

如何安装

用法

使用Twig渲染

简单渲染