当前位置: 首页 > article >正文

QD1-P5 HTML常用标签:段落和换行

本节视频

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

本节学习 HTML 标签:

  • 段落
  • 换行

一、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.kler.cn/news/338998.html

相关文章:

  • 麒麟系统串口配置篇
  • Qt教程(001):Qt概述与安装
  • 如何实现 C/C++ 与 Python 的通信?
  • 【算法笔记】二分算法原理的深度剖析
  • 数据分析认知
  • 17 链表——21. 合并两个有序链表 ★
  • 【小技巧】mysql 判断表字段是否存在 删除字段 sql脚本
  • python爬虫 - 进阶requests模块
  • 【机器学习-无监督学习】降维与主成分分析
  • 命名管道Linux
  • Stable Diffusion绘画 | 如何做到不同动作表情,人物角色保持一致性(下篇)
  • 深度学习中的迁移学习:预训练模型微调与实践
  • 2024年liunx安装openvino非源码编译版(比源码编译简单!)
  • APP自动化搭建与应用
  • Linux 学习
  • 推荐!专业Substance 3D Painter v10.解锁版下载及安装 (3D绘画软件)
  • 最大异或对(每周一类)
  • 常用动词敬语形式大揭秘,柯桥零基础日语培训
  • 【C#生态园】提升C#图像处理与压缩效率:六款库全面比较
  • jQuery EasyUI 扩展