CSS
Contents
- Syntax
- Attributes
- Examples
- Example 1: Output just the stylesheet’s URL
- Example 2: Output the link to the section’s default stylesheet
- Example 3: Output the link to a named stylesheet
- Example 4: Output print and alternate stylesheets
- Example 5: Output print and alternate stylesheets calling flat files (v4.7.2+)
- Example 6: Output CSS declarations in the page source wrapped in a style tag (v4.9.0+)
- Example 7: Output CSS declarations with a custom wrapper tag (v4.9.0+)
- Genealogy
Syntax
<txp:css />
The basic css tag is a single tag used to output the URL of the stylesheet assigned in the Textpattern Sections panel.
Attributes
Tag will accept the following attributes (case-sensitive) as well as the global attributes :
format="value"v4.0.4+- How to format output: either return complete HTML link tag with necessary HTML attributes, or only the stylesheet’s URL. As of Textpattern 4.7.2 you can specify using physical (flat) files. As of Textpattern 4.9.0 you can output styles directly in the page sources.
- Values:
link,flat.link,url,flat.url,inlineor `` (empty). - Default:
url. media="value"v4.0.4+- HTML media attribute to be applied to link tag (when invoked with
format="link"). - Default:
screen. name="style name"- Link to specified style.
rel="value"v4.0.4+- HTML rel attribute to be applied to link tag (when invoked with
format="link"). - Default:
stylesheet. title="value"v4.0.4+- HTML title attribute to be applied to link tag (when invoked with
format="link"). - Default: unset.
Examples
Example 1: Output just the stylesheet’s URL
<head>
<!-- …tags… -->
<link rel="stylesheet" href="<txp:css />" media="screen, projector">
<!-- …more tags… -->
</head>
Example 2: Output the link to the section’s default stylesheet
<head>
<!-- …tags… -->
<txp:css format="link" />
<!-- …more tags… -->
</head>
Example 3: Output the link to a named stylesheet
<head>
<!-- …tags… -->
<txp:css format="link" name="style_name" />
<!-- …more tags… -->
</head>
Example 4: Output print and alternate stylesheets
<head>
<!-- …tags… -->
<txp:css format="link" name="plain" rel="alternate" title="Plain and simple style" />
<txp:css format="link" name="glossy" rel="alternate" title="Glossy style" />
<txp:css format="link" name="print" media="print" />
<!-- …more tags… -->
</head>
Example 5: Output print and alternate stylesheets calling flat files (v4.7.2+)
<head>
<!-- …tags… -->
<txp:css name="plain" media="all" rel="alternate" title="Plain and simple style" format="flat.link" />
<txp:css name="glossy" media="screen" rel="alternate" title="Glossy style" format="flat.link" />
<txp:css name="print" media="print" format="flat.link" />
<!-- …more tags… -->
</head>
Example 6: Output CSS declarations in the page source wrapped in a style tag (v4.9.0+)
<head>
<!-- …tags… -->
<txp:css name="theme-styles" format="inline" />
<!-- …more tags… -->
</head>
Example 7: Output CSS declarations with a custom wrapper tag (v4.9.0+)
<head>
<!-- …tags… -->
<style nonce="foo-bar-baz">
<txp:css name="theme-styles" format="" />
</style>
<!-- …more tags… -->
</head>
Genealogy
Version 4.9.0
inline and `` (empty) values added to format attribute.
Version 4.7.2
flat.link and flat.url values added to format attribute.
Version 4.3.0
n attribute deprecated and renamed to name.
Version 4.0.4
format, media, rel and title attributes added.