news 2026/7/27 5:31:21

HTML5文本元素

作者头像

张小明

前端开发工程师

1.2k 24
文章封面图
HTML5文本元素

文本元素

HTML5中支持的元素:HTML5元素周期表
可以网上查阅

h

标题
h1~h6 表示一级标题~六级标题
vscode ctrl+回车 --自动换到下一行
emmit插件: hKaTeX parse error: Expected '}', got 'EOF' at end of input: *6>{级别标题}

<h1>1级标题</h1><h2>2级标题</h2><h3>3级标题</h3><h4>4级标题</h4><h5>5级标题</h5><h6>6级标题</h6>

展示的效果 h1最大依次减小
是不是越大就越重要?
不是的 含义是含义,样式是样式,我们完全可以调整标题的大小

p

段落:

补充使用lorem 可以补充测试数据
lorem:乱数假文

p*6>lorem4<p>Lorem ipsum dolor sit.</p><p>Quaerat magnam necessitatibus corporis.</p><p>Ipsum impedit fugiat dignissimos.</p><p>Minus assumenda quasi ullam.</p><p>Numquam inventore eius consectetur.</p><p>Earum suscipit voluptatum soluta.</p>

spanp[无语义]

没有任何含义.仅用于设置样式

<p>三原色:红 绿 蓝<!-- 需求是让 红显示红色 绿显示绿色 蓝显示蓝色(不换行) --><spanstyle="color:red;"></span><spanstyle="color:green;">绿</span><spanstyle="color:blue;"></span></p>

拓展

以前:某些元素显示时候会独占一行(块元素).某些元素显示时不会(行内元素)
HTML5 现在已经弃用
为什么? 因为HTML5 标签语义化和样式无关 样式有CSS管控 做到分离

pre

预格式化文本元素
空白折叠:在源代码中连续的空白折叠(空格.回车.tab),在页面显示会显示为1个
例外:在pre元素中内容不会出现空白折叠
在pre元素中出现的内容,会按照源代码的格式展示在网页中
该元素通常用于网页中展示一些代码
pre元素的本质:是一个CSS的属性 white-space:pre;
给其他元素添加也会有pre效果

<pstyle="white-space:pre;">我有湖南国 分开了 var a=11 if(a){ console.log(a) }</p><pre>我有湖南国 分开了 var a=11 if(a){ console.log(a) }</pre>

通常在开发中活用code标签包裹,表示此处放源代码

<code><pre>var a=11 if(a){ console.log(a) }</pre></code>
版权声明: 本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若内容造成侵权/违法违规/事实不符,请联系邮箱:809451989@qq.com进行投诉反馈,一经查实,立即删除!
网站建设 2026/7/27 5:28:23

AI记忆系统CortexMemory:解决Agent Memory技术挑战

1. 为什么Agent Memory将成为AI应用的下半场去年我参与了一个企业级AI助手的开发项目&#xff0c;团队遇到一个令人啼笑皆非的场景&#xff1a;我们精心训练的代码助手在第一次任务中表现出色&#xff0c;准确理解了整个代码库的架构规范&#xff0c;甚至能根据历史Code Review…

作者头像 李华
网站建设 2026/7/27 5:26:52

Opus 5 vs Fable 5:AI模型选型实战指南与性能成本深度对比

最近在 AI 圈子里&#xff0c;一个消息引起了不小的震动&#xff1a;Opus 5 正式发布&#xff0c;官方宣称性能超越 Fable 5&#xff0c;价格却只有后者的一半。这听起来像是营销噱头&#xff0c;但背后反映的是 AI 模型领域正在发生的关键变化——性能不再是唯一竞争维度&…

作者头像 李华
网站建设 2026/7/27 5:25:11

医疗影像分割边界优化:MONAI框架实战解析

1. 医疗影像分割的精细化挑战与MONAI解决方案医疗影像分割一直是计算机辅助诊断中的核心环节&#xff0c;特别是在肿瘤识别、器官划分等场景中&#xff0c;分割边界的精度直接影响临床决策。传统分割方法&#xff08;如阈值法、区域生长法&#xff09;在复杂组织边界处常出现锯…

作者头像 李华
网站建设 2026/7/27 5:24:23

Gradio构建机器学习分类系统可视化界面实战

1. 项目概述这个分类系统可视化界面项目基于Gradio框架构建&#xff0c;旨在为机器学习分类模型提供快速、直观的交互式演示环境。作为一名长期从事AI应用开发的工程师&#xff0c;我发现Gradio特别适合需要快速验证模型效果或向非技术人员展示成果的场景。2. 技术选型与核心组…

作者头像 李华
网站建设 2026/7/27 5:22:50

零基础DVWA登录爆破:Burp Suite实战指南与避坑详解

1. 项目概述&#xff1a;从“看热闹”到“入门”的必经之路如果你刚刚接触网络安全&#xff0c;或者对渗透测试充满好奇&#xff0c;那么“DVWA”和“Burp Suite”这两个名字你一定不陌生。它们就像是安全领域的“新手村”和“瑞士军刀”&#xff0c;一个提供了绝佳的练习靶场&…

作者头像 李华