Zend_View-Helpers-HeadStyle.xml 6.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179
  1. <?xml version="1.0" encoding="UTF-8"?>
  2. <!-- EN-Revision: 14978 -->
  3. <!-- Reviewed: no -->
  4. <sect3 id="zend.view.helpers.initial.headstyle">
  5. <title>HeadStyle Helfer</title>
  6. <para>
  7. Das HTML Element <code>&lt;style&gt;</code> wird verwendet um CSS Stylesheets im HTML Element
  8. <code>&lt;head&gt;</code> zu inkludieren.
  9. </para>
  10. <note>
  11. <title>HeadLink verwenden um CSS Dateien zu verlinken</title>
  12. <para>
  13. <link linkend="zend.view.helpers.initial.headlink">HeadLink</link> sollte verwendet werden
  14. um <code>&lt;link&gt;</code> Elemente zu Erstellen die externe Stylesheets enthalten.
  15. <code>HeadScript</code> wird verwendet wenn man Stylesheets inline definieren will.
  16. </para>
  17. </note>
  18. <para>
  19. Der <code>HeadStyle</code> Helfer unterstützt die folgenden Methoden für das Setzen und Hinzufügen
  20. von Stylesheet Deklarationen:
  21. </para>
  22. <itemizedlist>
  23. <listitem><para><code>appendStyle($content, $attributes =
  24. array())</code></para></listitem>
  25. <listitem><para><code>offsetSetStyle($index, $content, $attributes =
  26. array())</code></para></listitem>
  27. <listitem><para><code>prependStyle($content, $attributes =
  28. array())</code></para></listitem>
  29. <listitem><para><code>setStyle($content, $attributes =
  30. array())</code></para></listitem>
  31. </itemizedlist>
  32. <para>
  33. In allen Fällen ist <code>$content</code> die aktuelle CSS Deklaration.
  34. <code>$attributes</code> sind alle zusätzlichen Attribute die das <code>style</code> Tag
  35. erhalten soll: lang, title, media, oder dir sind alle möglich.
  36. </para>
  37. <note>
  38. <title>Abhängige Kommentare setzen</title>
  39. <para>
  40. <code>HeadStyle</code> erlaubt es ein Script Tag in abhängige Kommentare zu setzen, das es
  41. erlaubt es vor speziellen Browsern zu verstecken. Um abhängige Tags zu setzen, muß der
  42. abhängige Wert als Teil des <code>$attrs</code> Parameters im Methodenaufruf übergeben werden.
  43. </para>
  44. <example id="zend.view.helpers.initial.headstyle.conditional">
  45. <title>Headstyle mit abhängigen Kommentaren</title>
  46. <programlisting role="php"><![CDATA[
  47. // Skripte hinzufügen
  48. $this->headStyle()->appendStyle($styles, array('conditional' => 'lt IE 7');
  49. ]]>
  50. </programlisting>
  51. </example>
  52. </note>
  53. <para>
  54. <code>HeadStyle</code> erlaubt auch das Erfassen von Style Deklarationen; das kann nützlich sein wenn
  55. eine Deklaration programmtechnisch erstellt werden soll und Sie dann woanders platziert wird. Die
  56. Verwendung hierfür wird in einem unten angeführten Beispiel gezeigt.
  57. </para>
  58. <para>
  59. Letztendlich kann auch die <code>headStyle()</code> Methode verwendet werden um schnellstens
  60. Deklarationselemente hinzuzufügen; die Signatur dafür ist
  61. <code>headStyle($content$placement = 'APPEND', $attributes = array())</code>.
  62. <code>$placement</code> sollte entweder 'APPEND', 'PREPEND', oder 'SET' sein.
  63. </para>
  64. <para>
  65. <code>HeadStyle</code> überschreibt jedes <code>append()</code>, <code>offsetSet()</code>,
  66. <code>prepend()</code>, und <code>set()</code> um die Verwendung der oben gelisteten speziellen
  67. Methoden zu forcieren. Intern wird jeder Teil als <code>stdClass</code> Token gespeichert, welches
  68. später serialisiert wird durch Verwendung der <code>itemToString()</code> Methode. Das erlaubt es
  69. die Teile im Stack zu Prüfen, und optional auch zu Ändern durch einfaches Modifizieren des
  70. zurückgegebenen Objektes.
  71. </para>
  72. <para>
  73. Der <code>HeadStyle</code> Helfer ist eine konkrete Implementation des
  74. <link linkend="zend.view.helpers.initial.placeholder">Platzhalter Helfers</link>.
  75. </para>
  76. <example id="zend.view.helpers.initial.headstyle.basicusage">
  77. <title>Grundsätzliche Verwendung des HeadStyle Helfers</title>
  78. <para>
  79. Ein neues Style Tag kann jederzeit spezifiziert werden:
  80. </para>
  81. <programlisting role="php"><![CDATA[
  82. // Stile hinzufügen
  83. $this->headStyle()->appendStyle($styles);
  84. ]]>
  85. </programlisting>
  86. <para>
  87. Die Reihenfolge ist in CSS sehr wichtig; es könnte sein das man sichergestellen muß das
  88. Deklarationen in einer speziellen Reihenfolge geladen werden wegen der Reihenfolge der Kaskade;
  89. die verschiedenen append, prepend und offsetSet Direktiven können für diesen Zweck verwendet werden:
  90. </para>
  91. <programlisting role="php"><![CDATA[
  92. // Styles in Reihenfolge bringen
  93. // Ein spezielles Offset platzieren:
  94. $this->headStyle()->offsetSetStyle(100, $customStyles);
  95. // Am Ende platzieren:
  96. $this->headStyle()->appendStyle($finalStyles);
  97. // Am Anfang platzieren:
  98. $this->headStyle()->prependStyle($firstStyles);
  99. ]]>
  100. </programlisting>
  101. <para>
  102. Wenn man damit fertig ist und alle Style Deklarationen im Layout Skript ausgegeben werden können
  103. kann der Helfer einfach wiederholt werden:
  104. </para>
  105. <programlisting role="php"><![CDATA[
  106. <?php echo $this->headStyle() ?>
  107. ]]>
  108. </programlisting>
  109. </example>
  110. <example id="zend.view.helpers.initial.headstyle.capture">
  111. <title>Den HeadStyle Helfer verwenden um Style Deklarationen zu Erfassen</title>
  112. <para>
  113. Hier und da müssen CSS Style Deklarationen programmtechnisch erstellt werden. Wärend String
  114. Kopplungen, HereDocs und ähnliches verwendet werden könnte, ist es oft einfacher das durch
  115. erstellen der Styles und deren Einfügung in PHP Tags zu machen. <code>HeadStyle</code> lässt
  116. das zu indem es in den Stack erfasst wird:
  117. </para>
  118. <programlisting role="php"><![CDATA[
  119. <?php $this->headStyle()->captureStart() ?>
  120. body {
  121. background-color: <?php echo $this->bgColor ?>;
  122. }
  123. <?php $this->headStyle()->captureEnd() ?>
  124. ]]>
  125. </programlisting>
  126. <para>
  127. Die folgenden Annahmen werden gemacht:
  128. </para>
  129. <itemizedlist>
  130. <listitem>
  131. <para>
  132. Die Style Deklarationen werden dem Stack angefügt. Wenn Sie den Stack ersetzen
  133. sollen oder an den Anfang hinzugefügt werden sollten muß 'SET' oder 'PREPEND'
  134. als erstes Argument an <code>captureStart()</code> übergeben werden
  135. </para>
  136. </listitem>
  137. <listitem>
  138. <para>
  139. Wenn zusätzliche Attribute für das <code>&lt;style&gt;</code> Tag spezifiziert
  140. werden sollen, dann müssen diese in einem Array als zweites Argument an
  141. <code>captureStart()</code> übergeben werden.
  142. </para>
  143. </listitem>
  144. </itemizedlist>
  145. </example>
  146. </sect3>
  147. <!--
  148. vim:se ts=4 sw=4 et:
  149. -->