HTML5学习系列之标题和正文、描述性信息

HTML5学习系列之标题和正文、描述性信息

  • 标题和正文
    • 标题
    • 段落
  • 描述性信息
    • 强调
    • 注解
    • 备选
    • 上下标
    • 术语
    • 代码
    • 预定义格式
    • 缩写词
    • 编辑提示
    • 引用
    • 引述
    • 换行显示
    • 修饰
    • 非文本注解
  • 总结


标题和正文

标题

按语义轻重排列:h1\h2\h3\h4\h5\h6

<h1>诗词介绍</h1>
<h2>诗词名称</h2>
<p>具体诗词</p>

段落

<p>标签定义段落文本。
尽量不用<div>\<br>,不符合语义。

描述性信息

强调

strong:重要
em:着重

<p><strong>请不要,特别是<em>!</em><strong></p>

在这里插入图片描述

注解

small元素标识注解

<dl>
	<dt></dt>
	<dd>399元<small>含游玩</small></dd>
</dl>

在这里插入图片描述

备选

bi作为备选项

  • b:实用目的提醒注意的文字
  • i:不同于其他文字的文字
<p>这是一个<b></b>盒子</p>
<p>这篇<i>散文</i>已经发表</p>

在这里插入图片描述
实在没看出来b的作用!

上下标

sup和sub用于标识上下标。

<i>x</i><sub>2</sub>
<i>y</i><sup>2</sup>

在这里插入图片描述

术语

dfn元素标识专用术语。

代码

code元素可以标记代码或文件名。如果用到“<>”,使用&lt;&gt;

<code>
code{}
</code>

在这里插入图片描述

预定义格式

pre元素可以定义预定义文本。

<pre>
pre{
	padding xx;
	}
</pre>

在这里插入图片描述

缩写词

abbr元素可以标记缩写词并解释其含义。

<style>
	abbr[title]{ border-bottom:1px dotted #000;}
</style>
<p><abbr title="HyperText Markup Language">HTML</abbr>是一门编程语言。</p>

在这里插入图片描述

编辑提示

  • ins:已添加的内容。
  • del:已删除的内容。

引用

cite标识引用或参考的对象。

引述

  • blockquote:引述独立的内容
  • q:引述短语

换行显示

br实现文本换行显示。

修饰

span是没有任何语义的行内元素。

<style typr="text/scc">
.red {color:red;}
</style>
<p><span class="red">HTML</span></p>

在这里插入图片描述

非文本注解

u为纯样式元素,用来为文本添加下划线。


总结

学习记录。
这篇有点像绘画,画出花的感觉。

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

算法通关村——归并排序

归并排序 1、归并排序原理 ​ 归并排序是一种很经典的分治策略。 ​ 归并排序(MERGE-SORT)简单来说就是将大的序列先视为若干小的数组&#xff0c;分成几个比较小的结构&#xff0c;然后是利用归并的思想实现的排序方法。将一个大的问题分解成一些小的问题分别求解&#xff…

区域入侵AI算法如何应用在工地场景,保卫工地施工安全?

在工地、厂区等施工场所&#xff0c;安全保障是必不可少的&#xff0c;特别是在人工智能技术日益成熟的今天&#xff0c;如何利用旭帆科技AI智能视频中的区域入侵算法助力智慧工地、保障工地安全呢&#xff1f; 1、建筑物周界安全 TSINGSEE青犀区域入侵算法可以用于监控建筑物…

03-CSS基础选择器

3.1 CSS基础认知&#x1f34e; 3.1.1 &#x1f441;️‍&#x1f5e8;️CSS概念 CSS&#xff1a;层叠样式表&#xff08;Cascading style sheets)&#xff0c;为网页标签增加样式表现的 语法格式&#xff1a; 选择器{<!-- 属性设置 -->属性名:属性值; <!--每一个…

大模型架构创新已死?

金磊 白交 发自 凹非寺 量子位 | 公众号 QbitAI 一场围绕大模型自研和创新的讨论&#xff0c;这两天在技术圈里炸了锅。 起初&#xff0c;前阿里技术VP贾扬清&#xff0c;盆友圈爆料吐槽&#xff1a;有大厂新模型就是LLaMA架构&#xff0c;但为了表示不同&#xff0c;通过改变…

wx.canvasToTempFilePath生成图片保存到相册

微信小程序保存当前画布指定区域的内容导出生成指定大小的图片&#xff0c;记录一下 api&#xff1a;wx.canvasToTempFilePath 效果&#xff1a; 代码&#xff1a;wxml <canvas style"width: {{screenWidth}}px; height: {{canvasHeight}}px;" canvas-id"my…

AI绘画工具汇总

目前市面上的AI绘画工具十分繁杂&#xff0c;以下工具可供参考&#xff1a; 1. Midjourney 添加图片注释&#xff0c;不超过 140 字&#xff08;可选&#xff09; Midjourney&#xff1a;最主流的AI绘图工具之一&#xff0c;出图效果好&#xff0c;简单学习就可上手。需要在di…

webstorm基础配置

设置左侧菜单栏文字大小 开启鼠标滚轮控制文字大小 配置自定义注释 设置左侧菜单栏文字大小&#xff1a;file》settings》Appearance&Behavior》Appearance 开启鼠标滚轮控制主界面文字大小&#xff1a;file》settings》Editor》General 配置自定义注释&#xff1a;fi…

【星海出品】SDN neutron (五) openvswitch

1、ovs-vswitchd组件是交换机的主要模块&#xff0c;运行在用户态&#xff0c;其主要负责基本的转发逻辑、地址学习、外部物理端口绑定等。还可以运用OVS自带的ovs-ofctl工具采用openflow协议对交换机进行远程配置和管理。 2、ovsdb-server组件是存储OVS的网桥等配置、日志以及…

2013年10月23日 Go生态洞察:字符串、字节、符文和字符

&#x1f337;&#x1f341; 博主猫头虎&#xff08;&#x1f405;&#x1f43e;&#xff09;带您 Go to New World✨&#x1f341; &#x1f984; 博客首页——&#x1f405;&#x1f43e;猫头虎的博客&#x1f390; &#x1f433; 《面试题大全专栏》 &#x1f995; 文章图文…

正则匹配去除HTMl标签

正则匹配去除HTMl标签 案例&#xff1a;如在textarea中去除标签 操作方法 val.replace(/<[^>]>/g, ‘’))

【2015年数据结构真题】

用单链表保存m个整数&#xff0c;结点的结构为 [data] [link]&#xff0c;且|data|<n(n为正整数)。现要求设计一个时问复杂度尽可能高效的算法&#xff0c;对于链表中 data 的绝对值相等的结点&#xff0c;仅保留第一次出现的结点而删除其余绝对值相等的结点。例如&#xff…

ai语音电销机器人电销行业要怎么降低封号率?

工信部对电话营销电话的管控越来越严格&#xff0c;企业电销行业的发展受到了很多限制&#xff0c;因为电话销售人员在进行销售工作的时候&#xff0c;经常会因为各种原因触发封号机制&#xff0c;导致手机卡号被封&#xff0c;那企业电销行业要怎么降低封号率&#xff1f; 很多…

上门预约小程序开发app创业有哪些优势?

上门小程序app创业优势如下&#xff1a; 1. 无需租金&#xff0c;省下房租费用。由于采用技师上门服务&#xff0c;因此无需租用门店&#xff0c;为您节省了数十万的房租&#xff0c;省下来的就是赚的&#xff01; 2. 无需招聘全职技师和员工&#xff0c;省下工资。技师以兼职方…

vue中ref的用法

vue中ref的用法 在项目中使用ref时有时候直接取值,有时候返回的却是一个数组,不知其中缘由,后查了一下ref用法,所以总结一下. 1.绑定在dom元素上时&#xff0c;用起来与id差不多&#xff0c;通过this.$refs来调用: <div id"passCarEchart" ref"passCarEch…

如何在jupyter 上安装Office365-REST-Python-Client

最近工作需要写python代码从sharepoint 上定期load 数据写入到SQL server 中&#xff0c; 首先需要安装 office365 的python库&#xff08;python库名&#xff1a; Office365-REST-Python-Client&#xff09;但是直接安装失败了。 !pip install Office365-REST-Python-Client…

Java 等后端应用如何获取客户端真实IP —— 筑梦之路

需求说明 现有一套Java开发的应用&#xff0c;需要能获取到用户访问的真实IP地址&#xff0c;以此来过滤到一些不安全的因素。而实际部署的场景中Java服务提供给用户访问需要经过多次代理&#xff0c;默认情况下是无法获取到客户端真实IP地址的&#xff0c;因此要实现该需求&a…

mac下vue-cli从2.9.6升级到最新版本

由于mac之前安装了 vue 2.9.6 的版本&#xff0c;现在想升级到最新版本&#xff0c;用官方给的命令&#xff1a; npm uninstall vue-cli -g 发现不行。 1、究其原因&#xff1a;从vue-cli 3.0版本开始原来的npm install -g vue-cli 安装的都是旧版&#xff0c;最高到2.9.6。安…

游戏报错找不到xinput1_3.dll如何解决呢?分享5个解决方法对比

由于找不到xinput1_3.dll,无法继续执行代码的5个解决方法与丢失原因分享。 xinput1_3.dll是一个动态链接库文件&#xff0c;它包含了一些重要的函数和数据结构&#xff0c;用于支持游戏手柄等设备的操作。当这个文件丢失或损坏时&#xff0c;就会导致程序无法正常运行。 那么…

挂耳式运动耳机哪个品牌好?5款公认好用的运动耳机推荐

​在现代社会&#xff0c;耳机已经成为了人们生活中必不可少的数码设备。在运动的时候&#xff0c;佩戴耳机更是成为了很多人的标配。但是&#xff0c;市面上的运动耳机种类繁多&#xff0c;如何选择一款适合自己的呢&#xff1f;今天我为大家挑选了5款公认好用的运动耳机&…

普通测径仪升级的智能测径仪 增添11大实用功能!

普通测径仪能对各种钢材进行非接触式的外径及椭圆度在线检测&#xff0c;测量数据准确且无损&#xff0c;可测、监测、超差提示、系统分析等。在此基础上&#xff0c;为测径仪进行了进一步升级制成智能测径仪&#xff0c;为其增添更多智能化模块&#xff0c;让其使用更加方便。…