Update README.md with example to clarify attribute and element name conflicts (#252) Adding an example of the usage of the StyleEl tag given attribute and element name conflicts. I keep making this error and felt it might be ergonomically useful to put an example in the readme. This may also better enable LLMs to understand how to use the module.
1 file changed, 23 insertions(+), 0 deletions(-)
changed files
M README.md → README.md
@@ -156,3 +156,26 @@ - `form` (`Form`/`FormAttr`, `FormEl` also exists) - `label` (`Label`/`LabelAttr`, `LabelEl` also exists) - `style` (`StyleEl`/`Style`, `StyleAttr` also exists) - `title` (`TitleEl`/`Title`, `TitleAttr` also exists) + +For example, when adding CSS styles to your HTML document: + +```go +// This adds a style attribute to the div element +div := Div(Style("color: red;")) + +// This creates a style element with CSS rules for your document head +cssRules := StyleEl(g.Raw("h1 { color: blue; } p { font-size: 16px; }")) + +// Complete example in an HTML5 document +document := HTML5(HTML5Props{ + Title: "My Page", + Head: []g.Node{ + // Adds <style>h1 {color: blue; }</style> inside the <head> + StyleEl(g.Raw("h1 {color: blue; }")), + // Adds an external stylesheet + Link(Rel("stylesheet"), Href("/styles.css")), + }, + Body: []g.Node{ + H1(Text("Hello World")), + }, +})