CSS Anweisungen direkt im Typoscript
Eigentlich ist es üblich das die CSS Datei im Typoscript Setup angebunden ist und somit extern existiert. Manchmal kann es allerdings auch notwendig sein CSS Anweisungen direkt im Typoscript zu realisieren.
Dazu folgende zwei Möglichkeiten
page.CSS_inlineStyle (
a:link
{color:#000099; text-decoration:none;}
a:visited
{color:#000099; text-decoration:none;}
a:active
{color:#000099; text-decoration:none;}
a:hover
{color:#000099; text-decoration:none;}
)
CSS Anweisungen direkt im Setup des Typoscript Template
Das klassische Einbinden von CSS Dateien finden Sie hier:
CSS = PAGE
CSS {
typeNum = 35
config {
additionalHeaders = Content-type: text/css
disableAllHeaderCode = 1
}
10 = TEXT
10.value (
h1{
font-size:1.6em;
padding:12px 0 8px 0;
color: {$meinText.wert};
}
a:link
{color:{$meinText.link}; text-decoration:none;}
a:visited
{color:{$meinText.link}; text-decoration:none;}
a:active
{color:{$meinText.link}; text-decoration:none;}
a:hover
{color:{$meinText.druber}; text-decoration:none;}
)
}
page.headerData.100 = TEXT
page.headerData.100.dataWrap = <link rel="stylesheet" type="text/css" href="index.php?id={field:uid}&type=35" />
und noch eine Möglichkeit CSS im TS zu definieren
Dynamisches CSS?
In diesem Zusammenhang möchte ich hier eine Möglichkeit von "dynamischen CSS" festhalten.
Ein interessantes Zusammenspiel von Konstanten und CSS im TS. Die Werte werden hier in den Konstanten gehalten, diese werden dann im Setup in die dort definierten CSS Formatierungen übernommen.
meinText.wert = red
meinText.link = green
meinText.druber = black
in den Konstants des Typoscript Templates
page.CSS_inlineStyle (
a:link
{color:{$meinText.link}; text-decoration:none;}
a:visited
{color:{$meinText.link}; text-decoration:none;}
a:active
{color:{$meinText.link}; text-decoration:none;}
a:hover
{color:{$meinText.druber}; text-decoration:none;}
)
dann das Setup des selben Typoscript Template
War das Ihnen eine Hilfe? ein "LIKE" wäre ein tolles "Dankeschön"