QD1-P5 HTML 段落标签(p)换行标签(br)

news2024/11/25 7:10:29

本节视频

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

本节学习 HTML 标签:

  • p标签 段落
  • br标签 换行

一、p 标签-段落

1.1 使用 p 标签划分段落

<p>段落文本</p>
  • 示例
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>P5-段落和换行</title>
	</head>
	<body>
		<h1>题龙阳县青草湖</h1>
		<p>唐珙·元	</p>
		<p>西风吹老洞庭波,</p>
		<p>一夜湘君白发多。</p>
		<p>醉后不知天在水,</p>
		<p>满船清梦压星河。</p>
	</body>
</html>

Clip_2024-10-08_20-05-21

1.2 align 属性

  • align-设置元素(段落)的对齐方式:

    • align="left"​:左对齐
    • align="right"​:右对齐
    • align="center"​:居中对齐
    • align="justify"​:两端对齐
  • 示例

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>P5-段落和换行</title>
	</head>
	<body>
		<h1 align="center">题龙阳县青草湖</h1>
		<p align="center">唐珙·元	</p>
		<p align="center">西风吹老洞庭波,</p>
		<p align="center">一夜湘君白发多。</p>
		<p align="center">醉后不知天在水,</p>
		<p align="center">满船清梦压星河。</p>
		<br/>
		<h2 align="left">译文</h2>
	
		<p>秋风飒飒而起,广袤无垠的洞庭湖水,泛起层层白波,一夜愁思,湘君也多了白发。</p>
		<p>醉卧扁舟,只见一片星光璀璨的世界,似幻似真、缥缈迷离。不知道是天上的星辰倒映在水中,还是我身处梦境呢</p>
	</body>
</html>

Clip_2024-10-08_20-19-29

二、br 标签-换行

上述古诗句使用 p 标签换行,故而每句都是一个独立段落。而使用 br 标签可以在一个段落中达成同样的换行效果,只需要在想要换行的地方添加:

<br />
  • 示例
		<p align="center">
			西风吹老洞庭波,<br />一夜湘君白发多。<br />
			醉后不知天在水,<br />满船清梦压星河。<br />
		</p>

Clip_2024-10-08_20-31-52

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/2208829.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

算法剖析:滑动窗口

文章目录 前言一、长度最小的子数组二、无重复字符的最长子串三、最大连续1的个数 III四、将 x 减到 0 的最小操作数五、水果成篮六、找到字符串中所有字母异位词七、串联所有单词的子串八、最小覆盖子串总结 前言 滑动窗口可以看作为一种特殊的通向双指针&#xff0c;这两个指…

轻松翻译:顶尖翻译器评测!

在工作生活中如果遇到翻译需求&#xff0c;就少不了一些好用的翻译器&#xff0c;接下来是我们就来为大家推荐几款市面上口碑极佳的翻译软件&#xff01; 福昕在线翻译 直达链接&#xff1a; fanyi.pdf365.cn/ 操作教程&#xff1a;立即获取 福昕在线翻译是一款基于云端技…

关于部分股市买卖的演示和总结

本文是对上一文的补充&#xff1a;一个普通人的投资认知-CSDN博客 一、简介 假设公司A 向某交易所发行100股股票&#xff0c;每股5元&#xff0c;预计将融资500元。 股民a买了10股&#xff0c;付出50元。 股民b买了20股&#xff0c;付出100元。 股民c买了30股&#xff0c;付出…

【3维视觉】超级好用的3D模型交互式可视化工具viser

项目地址 https://github.com/nerfstudio-project/viser 功能 SMPL模型可视化编辑 点云可视化 3DGS实时渲染播放 安装和使用 安装viser git clone https://github.com/nerfstudio-project/viser.git使用 官方说明文档 1. SMPL模型可视化编辑 先下载SMPLX人体模型 下载解…

290. 单词规律【哈希表】

文章目录 290. 单词规律解题思路Go代码 290. 单词规律 290. 单词规律 给定一种规律 pattern 和一个字符串 s &#xff0c;判断 s 是否遵循相同的规律。 这里的 遵循 指完全匹配&#xff0c;例如&#xff0c; pattern 里的每个字母和字符串 s 中的每个非空单词之间存在着双向…

小程序知识付费的优势 知识付费服务 知识付费平台 知识付费方法

在信息爆炸的时代&#xff0c;知识如同繁星点点&#xff0c;璀璨而散落。如何在这片知识的海洋中精准捕捞&#xff0c;成为现代人追求自我提升的迫切需求。小程序知识付费&#xff0c;正是这样一座桥梁&#xff0c;它以独特的优势&#xff0c;让智慧触手可及&#xff0c;轻触未…

metahuman如何导入UE5

1.启动 通过EPIC启动UE5(UE5内置有Bridge, 但是UE4是需要单独下在Bridge软件) 2.打开Quixel Bridge 在window(窗口)中打开Quixel Bridge 3.Bridge界面 在弹出的Bridge界面选择模型 需要先下载&#xff0c;然后再导入 4.下载模型 点击需要的模型右上方的绿色箭头下载 5.下…

TensorRT-LLM七日谈 Day1

Flag 利用7天时间熟悉tensort-llm的代码架构&#xff0c;cublas的使用方式以及flash attention的调优。 项目链接 https://github.com/NVIDIA/TensorRT-LLM 安装 https://nvidia.github.io/TensorRT-LLM/installation/linux.html 它的安装主要是需要下载相应的docker镜像&am…

金奖!实在Agent智能体问鼎华为昇腾AI创新大赛

为推动浙江计算产业高质量发展&#xff0c;激发行业数智化原生创新与规模化应用&#xff0c;华为于10月10日在杭州举办“激发原生创新&#xff0c;共赢数智浙里”浙江鲲鹏昇腾产业与人才创新论坛暨鲲鹏&昇腾创新大赛2024浙江总决赛颁奖仪式。 中国工程院院士、浙江大学教授…

STM32学习--5-1 对射式红外传感器计次

接线图 原理图&#xff1a; CountSensor.c #include "stm32f10x.h" // Device headeruint16_t CountSensor_Count;void CountSensor_Init(void) {RCC_APB2PeriphClockCmd(RCC_APB2Periph_GPIOB,ENABLE); // 开启APB2Periph外设GPIOB时钟RCC_APB2Pe…

react中css样式隔离

使用CSS Modules css模块化 1, 创建组件样式文件时以 xxx.module.css命名, 例如 Home.module.css 代替 Home.css 2, 在组件jsx导入样式文件时使用 import styles from ./xxx.module.css 导入 代替 import ./xxx.css 3, 在组件中需要设置样式的标签上添加class值, classNa…

xss-labs靶场第七关测试报告

目录 一、测试环境 1、系统环境 2、使用工具/软件 二、测试目的 三、操作过程 1、注入点寻找 2、使用hackbar进行payload测试 3、绕过结果 四、源代码分析 五、结论 一、测试环境 1、系统环境 渗透机&#xff1a;本机(127.0.0.1) 靶 机&#xff1a;本机(127.0.0.…

Apache SeaTunnel 9月份社区发展记录

各位热爱 SeaTunnel 的小伙伴们&#xff0c;9月份社区月报来啦&#xff01;这里将定期更新SeaTunnel社区每个月的重大进展&#xff0c;欢迎关注&#xff01; 月度Merge Stars 感谢以下小伙伴上个月为 Apache SeaTunnel 做的精彩贡献&#xff08;排名不分先后&#xff09;&…

Spring Boot在医疗行业B2B交互系统中的应用案例

第3章 需求分析与可行性分析 3.1 需求分析 伴随着信息行业的蓬勃发展和人们办公自动化意识的增强&#xff0c;学习信息管理部门的工作也越来越繁重&#xff0c;原来的基于B2B平台的医疗病历交互系统已经不能完全满足相关人员使用的需要。为了协助信息开展学习信息管理工作&…

大数据处理从零开始————10.MapReduce编程实践之统计历年最高温度

1.项目目标 1.1 需求概述 现在我们想统计历年来的最高温度&#xff0c;要从给定的数据中&#xff0c;计算每一年的最高温度是多少。 1.2 业务分析 要统计给定格式数据中每一年的最高温度&#xff0c;可以使用MapReduce编写一个Hadoop来处理该数据。 Mapper类将提取每一行数据…

使用Milvus和Llama-agents构建更强大的Agent系统

代理&#xff08;Agent&#xff09;系统能够帮助开发人员创建智能的自主系统&#xff0c;因此变得越来越流行。大语言模型&#xff08;LLM&#xff09;能够遵循各种指令&#xff0c;是管理 Agent 的理想选择&#xff0c;在许多场景中帮助我们尽可能减少人工干预、处理更多复杂任…

【模型】Encoder-Decoder模型中Attention机制的引入

在 Encoder-Decoder 模型中引入 Attention 机制&#xff0c;是为了改善基本Seq2Seq模型的性能&#xff0c;特别是当处理长序列时&#xff0c;传统的Encoder-Decoder模型容易面临信息压缩的困难。Attention机制可以帮助模型动态地选择源序列中相关的信息&#xff0c;从而提高翻译…

06-ArcGIS For JavaScript-requestAnimationFrame动画渲染

文章目录 概述setInterval&#xff08;&#xff09;与setTimeout()requestAnimationFrame()requestAnimationFrame在ArcGIS For JavaScript的应用结果 概述 本节主要讲解与时间相关的三个方法setTimeout()、setInterval()和requestAnimationFrame()&#xff0c;这三个方法都属…

怎样提高员工效率与客户转化率?

在当今商业竞争日益激烈的市场环境中&#xff0c;企业越来越注重提升员工的工作效率和客户的转化率。以下是几种高效的策略&#xff0c;可以帮助企业激发新的业务活力&#xff1a; 1、自动快捷回复消息 自动快捷回复功能&#xff0c;是提升客户沟通效率的有力工具。通过设置自…

注册电气工程师印章要求

一、边框 1.尺寸&#xff1a;长63mm、宽28mm、线宽&#xff1a;0.6mm 2.第一格&#xff1a;宽7.25mm 3.第二格&#xff1a;宽19.2mm 二、文字 1.第一行 名称&#xff1a;行长59.50mm 字高5.61mm 字体 宋体 2.第二行 姓名&#xff1a;行长42.00mm 字高5.28mm 字体 姓名 宋体 人名…