QD1-P8 HTML格式化标签

已于 2024-10-09 16:05:53 修改
阅读量154 收藏 3
点赞数 1
分类专栏： 前端学习笔记1 文章标签： 前端基础
于 2024-10-09 16:04:31 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_38641599/article/details/142789346
版权

本节学习：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​

‍

灵魂信息
关注
专栏目录
introduction（html）(1-26)
Major_S的博客
02-11 1万+
1.课程简介 2.网页简史 3.HTML简介 4.编写你的第一个网页 5.安装notepad++ 6.自结束标签和注释 7.标签中的属性 8.文档声明 9.关于进制 10.字符编码 11.文档的使用 12.VSCode的安装 13.配置liveServer 14.实体 15.meta标签 16.语义化标签(1) 17.块和行内 18.语义化标签(2) 19.列表 20.超链接简介 21.相对路径...
HTML基本知识
weixin_52775879的博客
08-02 4万+
前端Html基础知识
hasLayout与Block Formatting Context（块格式化上下文）
01-15 1043
标准参考 Block Formatting Context （块格式化上下文）是 W3C CSS 2.1 规范中的一个概念，它决定了元素如何对其内容进行定位，以及与其他元素的关系和相互作用。 　　在创建了 Block Formatting Context 的元素中，其子元素会一个接一个地放置。垂直方向上他们的起点是一个包含块的顶部，两个相邻的元素之间的垂直距离取决于 ...
2021-08-19
javazhudong的博客
08-19 2180
图片是每一个Java程序员都要面对的，不管审核还是，什么? 下面就有我带大家看看开发中经常解决的图片怎么解决的,希望可以给你带了帮助 1将图片搞成base64位进行解决 @SpringBootTest class SpringqqApplicationTests { @Test void contextLoads() { String path="D:\\.temp\\dd\\1.png"; String path1="D:\\.temp\\dd\\img\\";
前端学习笔记（HTML篇）
m0_59388647的博客
04-09 6272
1 . 软件的分类2 . 客户端和服务器通常情况下，现在的软件一般由两个部分组成：（1）客户端：用户通过客户端来使用软件（2）服务器：服务器负责在远程处理业务逻辑3 . 服务器开发语言4 . 客户端的形式（1） 文字客户端古老的方式，通过命令行来使用软件（2）图形化界面windows、macOS、Androud、IOS中大部分使用（C/S架构）（3）通过访问网页来使用。
Vue3 -- 基于Websocket实现简易聊天室
zhangdm的博客
06-10 3万+
聊天室
基于python-scrapy框架的爬虫系统
热门推荐
qq_41390161的博客
11-13 8万+
爬虫简单介绍 需要毕设的同学可以联系我：609997553/wechat:wwj901521 一、爬虫：就是抓取网页数据的程序 二、爬虫如何抓取： 网页三大特征： 网页都有自己唯一的URL（统一资源定位符）来进行定位 网页都使用HTML （超文本标记语言）来描述页面信息。 网页都使用HTTP/HTTPS（超文本传输协议）协议来传输HTML数据。 爬虫的设计思路： 首先确定需要爬取的网页URL...
RedHat-RHCE-RHEL8
黑猴子的博客
11-22 3185
RHCE8.2 RH124 RH134 RH294 RHCE 7.0 RH124 RH134 RH254 RH124 + RH134 = EX200 RHCE 8.0 RH124 RH134 RH294 RH294 = EX294 Redhat级别 RHCSA、RHCE、RHCA EX200v8 -> RHCSA 上午 考试时长 3小时 EX294 -> RHCE 下午 考试时长 4小时 day01 =============================================
微服务框架springcloud（实用篇）【5】Elasticsearch 01
努力学习ing
12-02 4417
Elasticsearch基础
三菱 QD70定位模块用户手册.rar
10-08
【标题】中的“三菱 QD70定位模块用户手册”是指一本详细介绍了三菱自动化设备中的QD70系列定位模块的使用、配置和技术规格的指南。这个模块是三菱工业自动化系统中的一个重要组成部分，主要用于实现精确的定位控制...
【SpringCloud微服务实战09】Elasticsearch 搜索引擎
李维山的博客
03-17 1350
Elasticsearch是基于文档存储的，文档可以是数据库中的一条商品数据，也可以是一个订单信息等等，这条数据会被序列化为json格式后存储在Elasticsearch当中。旨在提供一个独立于 Elasticsearch 服务器代码的库，并为所有 Elasticsearch 功能提供非常一致且更易于使用的 API，以下我们使用。分词器作用：创建倒排索引时对文档分词、用户搜索时对输入的内容分词。Kibana是ES的可视化界面，便于我们开发学习。默认分词器对中文支持不好，这里使用IK分词器。
yolov8系列(二)-训练自己的目标分割模型,并web部署
GeekPlusA的博客
04-13 1773
1：支持各种版本的模型检测包括N、S、M、L、X检测模型和N、S、M、L、X分割模型，支持自己训练的模型。4：支持检测分割后的图片预览，保存。图片中的目标大小等级分类，分为大目标、中目标、小目标。下面用一个例子来说明如何使用yolov8训练自己的目标分割数据：高压电线覆冰模型。5：支持参数调整，包括推理尺寸、置信度阈值、IOU阈值。labelme标注好的数据集转换为yolo可训练的数据。2：支持本地上传图片检测，支持设定好的图片检测。3：支持图片编辑，编辑后的图片检测。文件中的对应配置，开始训练。
【超强组合】基于淘金优化算法GRO-BP-Adaboost的数据分类预测算法Matlab实现.rar
10-08
1.版本：matlab2014/2019a/2024a 2.附赠案例数据可直接运行matlab程序。 3.代码特点：参数化编程、参数可方便更改、代码编程思路清晰、注释明细。 4.适用对象：计算机，电子信息工程、数学等专业的大学生课程设计、期末大作业和毕业设计。 替换数据可以直接使用，注释清楚，适合新手
VMware Workstation Pro 和 VMware Fusion 安装与配置指南
10-08
内容概要：本文档详细指导了如何在不同的主机环境下，通过 VMWare 的两款产品——Workstation Pro 和 Fusion 进行新虚拟机的构建流程以及具体的操作要点说明。 适用人群：希望在单一机器上部署多操作系统的工作环境或学习测试场景的技术人员和学生。 使用场景及目标：旨在帮助初学者搭建属于自己的虚拟机实验平台，从而方便进行软件测试或者研究操作系统相关的新特性等任务，同时也有利于团队间的协作和资源调配。 注意事项：文中涉及的具体操作如下载源文件、配置网络参数时要注意版权合法性问题和技术安全防范。此外还需依据各自电脑的软硬件条件适当增减虚拟机的资源设定。
科研经费管理系统 SSM毕业设计 源码+数据库+论文（JAVA+SpringBoot+Vue.JS）.zip
10-08
科研经费管理系统 SSM毕业设计 源码+数据库+论文（JAVA+SpringBoot+Vue.JS） 启动教程：https://www.bilibili.com/video/BV1GK1iYyE2B
使用Python Matplotlib进行图形输出与保存详解（包含详细的完整的程序和数据）
10-08
内容概要：本文详细介绍了使用 Python 的 Matplotlib 库来输出和保存图形的方法。不仅涉及了基本流程，如生成图表并将之导出成PNG、PDF和SVG等不同格式的内容，还包括高级话题如设置透明度、分辨率以及制作包含图形元素的HTML页面等。文章通过一个具体的示例代码讲解了各个环节的关键细节和技术要点。 适用人群：对数据可视化有兴趣的初学者及具有一定基础想要深入学习 Matplotlib 使用技巧的技术人员。 使用场景及目标：适用于需要掌握 Matplotlib 不同输出选项及其特点的应用场合，尤其是当需要生成用于打印或网页展示的高质量、可自定义外观的图形时。
【数字信号分离】基于matlab自然梯度算法盲信号分离（含串音信号 变步长）【含Matlab源码 8813期】.zip
10-08
CSDN海神之光上传的代码均可运行，亲测可用，直接替换数据即可，适合小白； 1、代码压缩包内容 主函数：main.m； 调用函数：其他m文件；无需运行 运行结果效果图； 2、代码运行版本 Matlab 2019b或2023b；若运行有误，根据提示修改；若不会，私信博主； 3、运行操作步骤 步骤一：将所有文件放到Matlab的当前文件夹中； 步骤二：双击打开main.m文件； 步骤三：点击运行，等程序运行完得到结果； 4、仿真咨询 如需其他服务，可私信博主或扫描博客文章底部QQ名片； 4.1 博客或资源的完整代码提供 4.2 期刊或参考文献复现 4.3 Matlab程序定制 4.4 科研合作 功率谱估计： 故障诊断分析： 雷达通信：雷达LFM、MIMO、成像、定位、干扰、检测、信号分析、脉冲压缩 滤波估计：SOC估计 目标定位：WSN定位、滤波跟踪、目标定位 生物电信号：肌电信号EMG、脑电信号EEG、心电信号ECG 通信系统：DOA估计、编码译码、变分模态分解、管道泄漏、滤波器、数字信号处理+传输+分析+去噪（CEEMDAN）、数字信号调制、误码率、信号估计、DTMF、信号检测识别融合、LEACH协议、信号检测、水声通信
基于多元宇宙优化算法MVO优化CNN-BiGRU-Attention锂电池健康寿命预测算法研究Matlab实现.rar
最新发布
10-08
1.版本：matlab2014/2019a/2024a 2.附赠案例数据可直接运行matlab程序。 3.代码特点：参数化编程、参数可方便更改、代码编程思路清晰、注释明细。 4.适用对象：计算机，电子信息工程、数学等专业的大学生课程设计、期末大作业和毕业设计。 替换数据可以直接使用，注释清楚，适合新手
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值