QD1-P8 HTML 格式化标签(font、pre、b、strong、i、u、del、s、sub、sup)

server/2024/10/20 17:21:58/

本节学习:HTML 格式化标签。

本节视频

www.bilibili.com/video/BV1n64y1U7oj?p=8

一、font 标签

  • 用途:定义文本的字体大小、颜色和 face(字体类型)。

  • 示例

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>P8-格式化标签</title></head><body>示例文字<br /><font color="red" size=5"" face="仿宋">示例文字</font><br /><font color="red" size=5"" face="楷体">示例文字</font></body>
</html>

渲染效果

Clip_2024-10-09_15-17-29

二、pre 标签

  • 用途:HTML 代码中的文本渲染到浏览器时,默认忽略换行,默认将多个空格视为一个空格。在 HTML 中需使用标签确定文本格式,例如 pre 标签,定义预格式化文本,渲染时将会:

    • 保留文本中的空格和换行
    • 并且使用等宽字体
  • 示例

pre 标签中的文本会保持输出的格式展现在浏览器中

Clip_2024-10-09_15-23-29

三、粗体

  • b 标签和 strong 标签都有加粗效果
示例文字1<b>示例文字2</b><strong>示例文字3</strong>

渲染​​

Clip_2024-10-09_15-34-45

b 标签的本意就是加粗,strong 标签的本意是突出显示。

三、斜体

斜体使用 i 标签,示例

斜体:<i>斜体</i>

渲染

​​​Clip_2024-10-09_15-48-06

四、下划线

下划线使用 u 标签,示例

下划线:<u>下划线</u>

渲染

Clip_2024-10-09_15-50-10

五、中划线(删除线)

中划线使用 s 标签或者 del 标签,示例

中划线:<del>中划线</del>

渲染

Clip_2024-10-09_15-51-40

六、上标

上标使用 sup 标签,示例

上标:2<sup>10

渲染

Clip_2024-10-09_15-52-55

七、下标

下标使用 sub 标签,示例

下标:H<sub>2</sub>O

渲染

Clip_2024-10-09_15-53-56


http://www.ppmy.cn/server/130874.html

相关文章

企业远控私有化部署解决方案-内信互联

内信互联&#xff08;DoLink&#xff09;&#xff0c;是点量软件新推出的企业私有化远程控制系统解决方案。很多朋友对这个产品还不是很了解&#xff0c;今天点量小编就对其基础功能做一些详细说明&#xff0c;如果您想快速拥有自己的企业私有远程控制系统&#xff0c;欢迎联系…

AJAX 2——Bootstrap弹框使用、图书管理案例、图片上传方法

AJAX 2——Bootstrap弹框使用、图书管理案例、图片上传方法 1.Bootstrap弹框使用-Modal 通过自定义属性控制 <button data-bs-toggle"modal" data-bs-target"CSS选择器">点击该按钮显示弹框</button><button data-bs-dismiss"modal&…

Django学习笔记十一:部署程序

部署Django应用程序是一个涉及多个步骤的过程&#xff0c;包括选择合适的服务器、配置Web服务器、设置数据库、管理静态文件和媒体文件、以及确保安全性等。以下是一些关键步骤和最佳实践&#xff1a; 选择服务器&#xff1a;你可以选择物理服务器、虚拟私服&#xff08;VPS&am…

网络常用配置和运维命令以及使用方法

一、网络运维常见配置及命令 以下是一些整理简单网络常用配置和运维命令 1、ifconfig/ipconfig&#xff1a;查看和配置网络接口配置。 用法&#xff1a;ifconfig 或 ipconfig2、route/netstat -r&#xff1a;查看路由表。 用法&#xff1a;route -n 或 netstat -r3、netsta…

leetcode209:长度最小的子数组

给定一个含有 n 个正整数的数组和一个正整数 target 。 找出该数组中满足其总和大于等于 target 的长度最小的 子数组 [numsl, numsl1, ..., numsr-1, numsr] &#xff0c;并返回其长度。如果不存在符合条件的子数组&#xff0c;返回 0 。 示例 1&#xff1a; 输入&#xf…

速盾:高防cdn和cdn该到底选哪个?

在网络加速和安全防护领域&#xff0c;高防 CDN&#xff08;Content Delivery Network&#xff0c;内容分发网络&#xff09;和普通 CDN 都是常见的解决方案。然而&#xff0c;很多人在面临选择时会感到困惑&#xff0c;不知道该选择高防 CDN 还是普通 CDN。下面我们来分析一下…

13.JVM内存模型深度剖析

一、JDK体系结构 JDK代表Java Development Kit(Java开发工具包)&#xff0c;是用于开发和编译Java应用程序的软件包。JDK是由Oracle提供的Java平台的官方实现&#xff0c;包含了开发和运行Java程序所需的工具、库和JRE(Java Runtime Environment)。 二、JAVA语言跨平台特性 Ja…

【机器学习】线性回归算法简介 及 数学实现方法

线性回归 简介 利用 回归方程(函数) 对 一个或多个自变量(特征值)和因变量(目标值)之间 关系进行建模的一种分析方式。 数学公式&#xff1a; ℎ_(w) w_1x_1 w_2x_2 w_3x_3 … b w^Txb 概念 ​ 利用回归方程(函数) 对 一个或多个自变量(特征值)和因变量(目标值)之间 关…