-
Notifications
You must be signed in to change notification settings - Fork 22.4k
/
index.md
128 lines (104 loc) · 3.17 KB
/
index.md
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
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
---
title: "<small>: the side comment element"
slug: Web/HTML/Element/small
page-type: html-element
browser-compat: html.elements.small
---
{{HTMLSidebar}}
The **`<small>`** [HTML](/en-US/docs/Web/HTML) element represents side-comments and small print, like copyright and legal text, independent of its styled presentation. By default, it renders text within it one font-size smaller, such as from `small` to `x-small`.
{{EmbedInteractiveExample("pages/tabbed/small.html", "tabbed-shorter")}}
## Attributes
This element only includes the [global attributes](/en-US/docs/Web/HTML/Global_attributes).
## Examples
### Basic usage
```html
<p>
This is the first sentence.
<small>This whole sentence is in small letters.</small>
</p>
```
#### Result
{{EmbedLiveSample("Basic_usage")}}
### CSS alternative
```html
<p>
This is the first sentence.
<span style="font-size:0.8em">This whole sentence is in small letters.</span>
</p>
```
#### Result
{{EmbedLiveSample("CSS_alternative")}}
## Notes
Although the `<small>` element, like the {{htmlelement("b")}} and {{htmlelement("i")}} elements, may be perceived to violate the principle of separation between structure and presentation, all three are valid in HTML. Authors are encouraged to use their best judgement when determining whether to use `<small>` or CSS.
## Technical summary
<table class="properties">
<tbody>
<tr>
<th scope="row">
<a href="/en-US/docs/Web/HTML/Content_categories"
>Content categories</a
>
</th>
<td>
<a href="/en-US/docs/Web/HTML/Content_categories#flow_content"
>Flow content</a
>,
<a href="/en-US/docs/Web/HTML/Content_categories#phrasing_content"
>phrasing content</a
>.
</td>
</tr>
<tr>
<th scope="row">Permitted content</th>
<td>
<a href="/en-US/docs/Web/HTML/Content_categories#phrasing_content"
>Phrasing content</a
>
</td>
</tr>
<tr>
<th scope="row">Tag omission</th>
<td>None; must have both a start tag and an end tag.</td>
</tr>
<tr>
<th scope="row">Permitted parents</th>
<td>
Any element that accepts
<a href="/en-US/docs/Web/HTML/Content_categories#phrasing_content"
>phrasing content</a
>, or any element that accepts
<a href="/en-US/docs/Web/HTML/Content_categories#flow_content"
>flow content</a
>.
</td>
</tr>
<tr>
<th scope="row">Implicit ARIA role</th>
<td>
<code
><a href="/en-US/docs/Web/Accessibility/ARIA/Roles/generic_role"
>generic</a
></code
>
</td>
</tr>
<tr>
<th scope="row">Permitted ARIA roles</th>
<td>Any</td>
</tr>
<tr>
<th scope="row">DOM interface</th>
<td>{{domxref("HTMLElement")}}</td>
</tr>
</tbody>
</table>
## Specifications
{{Specifications}}
## Browser compatibility
{{Compat}}
## See also
- {{HTMLElement("b")}}
- {{HTMLElement("sub")}} and {{HTMLElement("sup")}}
- {{HTMLElement("font")}}
- {{HTMLElement("style")}}
- HTML 4.01 Specification: [Font Styles](https://www.w3.org/TR/html4/present/graphics.html#h-15.2)