TiddlyWiki5/editions/tw5.com/tiddlers/wikitext/Styles and Classes in WikiText.tid

created: 20131205160532119
modified: 20131205160549129
tags: WikiText [[How to apply custom styles]]
title: Styles and Classes in WikiText
type: text/vnd.tiddlywiki
caption: Styles and Classes

Content can be wrapped in `@@`double at signs`@@`  to apply specified CSS styles or classes to it. There are multiple ways to use this syntax, as presented below.

Inline content wrapped in `@@`double at signs`@@` without specifying style or class will be assigned the `.tc-inline-style` and displayed as highlighted text. The foreground and background colours of the highlighted text are defined as `highlight-background` and `highlight-foreground` in the current palette.

<<wikitext-example src:"@@some highlighted text@@">>

Style attributes, e.g. `color`, each followed by `;` semicolon can be introduced immediately after the opening `@@`.

<<wikitext-example src:"@@color:steelblue;background-color:lightcyan;some styled text@@">>

Similarly a style can be applied to a multiline content:

<<wikitext-example src:"@@background-color:lightcyan;
* Item one
* Item two
@@
">>

A class may be applied to a multiline content only:

<<wikitext-example src:"@@.tc-double-spaced-list
* Item one
* Item two
@@">>

Multiple classes and styles can be used together:

<<wikitext-example src:"@@.tc-double-spaced-list
@@width:400px;background-color:lightcyan;
* Item one
* Item two
@@
">>
Big docs update Finally sorting out the wikitext documentation 2013-12-05 16:21:10 +00:00			`created: 20131205160532119`
			`modified: 20131205160549129`
Update Styles and Classes in WikiText.tid (#6969) Add tag to include this tiddler in the list in the tiddler https://tiddlywiki.com/prerelease/#How%20to%20apply%20custom%20styles 2022-10-02 16:37:03 +00:00			`tags: WikiText [[How to apply custom styles]]`
Big docs update Finally sorting out the wikitext documentation 2013-12-05 16:21:10 +00:00			`title: Styles and Classes in WikiText`
			`type: text/vnd.tiddlywiki`
Update wikitext documentation 2014-09-11 08:15:58 +00:00			`caption: Styles and Classes`
Big docs update Finally sorting out the wikitext documentation 2013-12-05 16:21:10 +00:00
Improve documentation of WikiText formatting (#7272) * Improve 'Formatting in WikiText.tid' Add highlight formatting example. Simplify code formatting example to be single line without nested list. Improve bold, italic, and underscore formatting examples to be consistent with others. * Improve 'Styles and Classes in WikiText.tid' Add more examples, including the default highlight styling when no style or class is defined, as introduced in #6877 2023-02-17 18:14:21 +00:00			Content can be wrapped in `@@`double at signs`@@` to apply specified CSS styles or classes to it. There are multiple ways to use this syntax, as presented below.
Big docs update Finally sorting out the wikitext documentation 2013-12-05 16:21:10 +00:00
Improve documentation of WikiText formatting (#7272) * Improve 'Formatting in WikiText.tid' Add highlight formatting example. Simplify code formatting example to be single line without nested list. Improve bold, italic, and underscore formatting examples to be consistent with others. * Improve 'Styles and Classes in WikiText.tid' Add more examples, including the default highlight styling when no style or class is defined, as introduced in #6877 2023-02-17 18:14:21 +00:00			Inline content wrapped in `@@`double at signs`@@` without specifying style or class will be assigned the `.tc-inline-style` and displayed as highlighted text. The foreground and background colours of the highlighted text are defined as `highlight-background` and `highlight-foreground` in the current palette.

			`<<wikitext-example src:"@@some highlighted text@@">>`

			Style attributes, e.g. `color`, each followed by `;` semicolon can be introduced immediately after the opening `@@`.
Big docs update Finally sorting out the wikitext documentation 2013-12-05 16:21:10 +00:00
Improve documentation of WikiText formatting (#7272) * Improve 'Formatting in WikiText.tid' Add highlight formatting example. Simplify code formatting example to be single line without nested list. Improve bold, italic, and underscore formatting examples to be consistent with others. * Improve 'Styles and Classes in WikiText.tid' Add more examples, including the default highlight styling when no style or class is defined, as introduced in #6877 2023-02-17 18:14:21 +00:00			`<<wikitext-example src:"@@color:steelblue;background-color:lightcyan;some styled text@@">>`
Big docs update Finally sorting out the wikitext documentation 2013-12-05 16:21:10 +00:00
Improve documentation of WikiText formatting (#7272) * Improve 'Formatting in WikiText.tid' Add highlight formatting example. Simplify code formatting example to be single line without nested list. Improve bold, italic, and underscore formatting examples to be consistent with others. * Improve 'Styles and Classes in WikiText.tid' Add more examples, including the default highlight styling when no style or class is defined, as introduced in #6877 2023-02-17 18:14:21 +00:00			`Similarly a style can be applied to a multiline content:`

			`<<wikitext-example src:"@@background-color:lightcyan;`
			`* Item one`
			`* Item two`
Big docs update Finally sorting out the wikitext documentation 2013-12-05 16:21:10 +00:00			`@@`
			`">>`

Improve documentation of WikiText formatting (#7272) * Improve 'Formatting in WikiText.tid' Add highlight formatting example. Simplify code formatting example to be single line without nested list. Improve bold, italic, and underscore formatting examples to be consistent with others. * Improve 'Styles and Classes in WikiText.tid' Add more examples, including the default highlight styling when no style or class is defined, as introduced in #6877 2023-02-17 18:14:21 +00:00			`A class may be applied to a multiline content only:`

			`<<wikitext-example src:"@@.tc-double-spaced-list`
			`* Item one`
			`* Item two`
			`@@">>`

			`Multiple classes and styles can be used together:`
Big docs update Finally sorting out the wikitext documentation 2013-12-05 16:21:10 +00:00
Improve documentation of WikiText formatting (#7272) * Improve 'Formatting in WikiText.tid' Add highlight formatting example. Simplify code formatting example to be single line without nested list. Improve bold, italic, and underscore formatting examples to be consistent with others. * Improve 'Styles and Classes in WikiText.tid' Add more examples, including the default highlight styling when no style or class is defined, as introduced in #6877 2023-02-17 18:14:21 +00:00			`<<wikitext-example src:"@@.tc-double-spaced-list`
			`@@width:400px;background-color:lightcyan;`
			`* Item one`
			`* Item two`
Big docs update Finally sorting out the wikitext documentation 2013-12-05 16:21:10 +00:00			`@@`
			`">>`