1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
|
# <border>
The `<border>` CSS type represents a border style.
## Syntax
The [`<border>`](./border.md) type can take any of the following values:
| Border type | Description |
|-------------|----------------------------------------------------------|
| `ascii` | A border with plus, hyphen, and vertical bar characters. |
| `blank` | A blank border (reserves space for a border). |
| `dashed` | Dashed line border. |
| `double` | Double lined border. |
| `heavy` | Heavy border. |
| `hidden` | Alias for "none". |
| `hkey` | Horizontal key-line border. |
| `inner` | Thick solid border. |
| `none` | Disabled border. |
| `outer` | Solid border with additional space around content. |
| `panel` | Solid border with thick top. |
| `round` | Rounded corners. |
| `solid` | Solid border. |
| `tall` | Solid border with additional space top and bottom. |
| `thick` | Border style that is consistently thick across edges. |
| `vkey` | Vertical key-line border. |
| `wide` | Solid border with additional space left and right. |
## Border command
The `textual` CLI has a subcommand which will let you explore the various border types interactively, when applied to the CSS rule [`border`](../styles/border.md):
```
textual borders
```
## Examples
### CSS
```css
#container {
border: heavy red;
}
#heading {
border-bottom: solid blue;
}
```
### Python
```py
widget.styles.border = ("heavy", "red")
widget.styles.border_bottom = ("solid", "blue")
```
|
