mirror of
https://github.com/Textualize/textual.git
synced 2025-10-17 02:38:12 +03:00
58 lines
1.8 KiB
Markdown
58 lines
1.8 KiB
Markdown
# Links
|
|
|
|
Textual supports the concept of inline "links" embedded in text which trigger an action when pressed.
|
|
|
|
There are a number of styles which influence the appearance of these links within a widget.
|
|
|
|
| Property | Description |
|
|
|-------------------------|-------------------------------------------------------------|
|
|
| `link-color` | The color of link text. |
|
|
| `link-background` | The background color of link text. |
|
|
| `link-style` | The style of link text (e.g. underline). |
|
|
| `link-hover-color` | The color of link text with the cursor above it. |
|
|
| `link-hover-background` | The background color of link text with the cursor above it. |
|
|
| `link-hover-style` | The style of link text with the cursor above it. |
|
|
|
|
## Syntax
|
|
|
|
```scss
|
|
link-color: <COLOR>;
|
|
link-background: <COLOR>;
|
|
link-style: <TEXT STYLE> ...;
|
|
link-hover-color: <COLOR>;
|
|
link-hover-background: <COLOR>;
|
|
link-hover-style: <TEXT STYLE> ...;
|
|
```
|
|
|
|
## Example
|
|
|
|
In the example below, the first `Static` illustrates default link styling.
|
|
The second `Static` uses CSS to customize the link color, background, and style.
|
|
|
|
=== "Output"
|
|
|
|
```{.textual path="docs/examples/styles/links.py"}
|
|
```
|
|
|
|
=== "links.py"
|
|
|
|
```python
|
|
--8<-- "docs/examples/styles/links.py"
|
|
```
|
|
|
|
=== "links.css"
|
|
|
|
```sass
|
|
--8<-- "docs/examples/styles/links.css"
|
|
```
|
|
|
|
## Additional Notes
|
|
|
|
* Inline links are not widgets, and thus cannot be focused.
|
|
|
|
## See Also
|
|
|
|
* An [introduction to links](../guide/actions.md#links) in the Actions guide.
|
|
|
|
[//]: # (TODO: Links are documented twice in the guide, and one will likely be removed. Check the link above still works after that.)
|