数据结构
网络
RDBMS
操作系统
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 编程
C++
C#
MongoDB
MySQL
Javascript
PHP
物理学
化学
生物学
数学
英语
经济学
心理学
社会学
时尚研究
法律研究在 HTML 中创建小文本
如果我们想在 HTML 文档中设置较小的字体大小，可以使用 <small> 标签。此标签用于将字体大小减小一个级别，即从中等大小减小到小尺寸，或从特大尺寸减小到大型尺寸。有两种方法可以使用此 <small> 标签在 HTML 中
嵌套形式
非嵌套形式
语法
以下是 HTML 中小字体标签的使用方法 -
<small>text… </small>
它具有开始和结束标签。它支持全局属性和事件属性。
示例
以下示例演示了 small 标签的使用 -
<!DOCTYPE html> <html> <head> <title>HTML small Tag</title> </head> <body> <h2>Tutorialspoint</h2> <p><small> Simply Easy Learning</small></p> </body> </html>
嵌套形式
如果我们在嵌套形式中使用 small 标签，它会根据父级字体大小更改其间存在的字体大小。例如，如果我们增加父文本的字体大小，small 标签的字体大小也会自动增加。
示例
以下示例演示了如何添加 HTML 的标题、主体和其他结构。
<!DOCTYPE html> <html> <head> <title>TutorialsPoint</title> </head> <body> <h2>HTML Tutorial</h2> <p style="font-size: 15px;">HTML means <small>Hyper Text Markup Language</small></p> </body> </html>
示例
在以下示例中，我们尝试增加 <small> 标签父元素的字体大小。
<!DOCTYPE html> <html> <head> <title>TutorialsPoint</title> </head> <body> <h2>HTML Tutorial</h2> <p style="font-size: 40px;">HTML means <small>Hyper Text Markup Language</small></p> </body> </html>
注意 - 嵌套小文本的字体大小与父元素文本的字体大小之间的比率相同。
什么是非嵌套形式？
非嵌套形式意味着，我们可以将 small 标签作为 HTML 中的单独元素使用，这样父元素的字体大小就不会影响 small 标签文本。
示例
以下是非嵌套 small 标签的示例 -
<!DOCTYPE html> <html> <head> <title>TutorialsPoint</title> </head> <body> <h2>HTML Tutorial</h2> <p style="font-size: 15px;">HTML means </p> <small>Hyper Text Markup Language</small> </body> </html>
示例
现在考虑另一个示例，尝试更改段落的字体大小，并检查 <small> 标签的字体大小发生了什么变化。
<!DOCTYPE html> <html> <head> <title>TutorialsPoint</title> </head> <body> <h2>HTML Tutorial</h2> <p style="font-size: 30px;">HTML means </p> <small>Hyper Text Markup Language</small> </body> </html>
对 <small> 标签的 CSS 设置
现在，我们尝试应用 CSS 属性，通过使用 small 标签来设置文本的字体大小。
<!DOCTYPE html>
<html>
<head>
<style>
span.small {
font-size: smaller;
color: blue;
}
</style>
</head>
<body>
<h2>Demonstrating smaller text by applying CSS</h2>
<p>HTML Means,</p>
<p>
<span class="small">Hyper Text Markup Language.</span>
</p>
</body>
</html>
更新于: 2023年10月10日
569 次查看
广告