超文本标记语言(html)之文字编辑

2023-11-10 19:40

本文主要是介绍超文本标记语言(html)之文字编辑,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

一、编辑内容

1.添加文字

基本语法

<body>
请在此处添加文字
</body>

语法说明

在网页中添加文字,只要在<body></body>之间,需要插入文字的地方输入文字就可以实现。

2 添加注释<! ---->

在HTML文件中,为了增加代码的可读性,需要对代码添加必要的注释。这些注释语句可方便编写者的检查与维护,同时这些注释信息也不会在网页中被显示。

基本语法

<html>
<head>
<!--请在此处添加注释语句-->
<title>添加语句</title>
</head>
<body>
<!--请在此处添加注释语句-->
</body>
</html>

实例代码:

<html>
<head><!--请在此添加注释语句!--><title>添加注释</title>
</head>
<body><!--请在此添加注释语句!-->清华大学出版社<Br>版权所有,违者必究!
</body>
</html>

3 .添加空格

在HTML文件中,添加空格的方式与其他文档添加空格的方式不同,网页中添加空格是通过代码控制,在Word、记事本、写字板中输入空格可以直接通过键盘空格键输入。

基本语法

<body>
&nbsp;&nbsp;&nbsp;
</body>

语法说明

在HTML文件中,添加空格需要使用代码"&nbsp;"控制,需要多少个空格就需要添加多少个"&nbsp;"。

实例代码:

<html>
<head> 
<title>添加空格</title>
</head>
<body>
&nbsp;&nbsp;&nbsp;&nbsp;财政部有关负责人说,所谓"首购",是指对于国内企业或科研机构生产或开发的,暂不具有市场竞争力,但符合国民经济发展要求、代表先进技术发展方向的首次投向市场的产品,通过政府采购方式由采购人或政府首先采购的行为。
</body>
</html>

4 . 添加删除线

在HTML文件中,给需要添加删除线的文字使用成对的<strike></strike>标记,就可以添加删除线

基本语法

<body>
<strike>请在此输入需要添加删除线的文字</strike>
</body>

语法说明

在成对的<strike></strike>标记之间输入文字,在网页中显示改标记之间的文字就是被添加了删除线后的显示效果

实例代码:

<html>
<head> 
<title>添加删除线</title>
</head>
<body>
给下面文字添加删除线<br>
<strike>添加了删除线的文字</strike>
</body>
</html>

二、文字效果

1.标题文字标签<hn>

<hn>标签一共为6级

基本语法:

<hn align=参数值>标题文字</hn>
align属性值为right,left(默认),center

实例代码:

<html>
<head>
<title>标题文字标签</title>
</head>
<body>
<h1 align="center">Header Level 1</h1>
<h2> Header Level 2</h2>
<h3> Header Level 3</h3>
<h4> Header Level 4</h4>
<h5> Header Level 5</h5>
<h6> Header Level 6</h6>
</body>
</html>

2. 编辑网页文字样式

基本语法

<body>
<font face=" " size=" " color=" "></font>
<body>

语法说明

在HTML文件中,利用成对标记就可以将网页中的文字根据需要,对其进行样式的编辑。

实例代码:

<html>
<head> 
<title>编辑网页文字样式</title>
</head>
<body>没有使用效果后的文字!<br><font face="楷体" size="6" color="#00ffff">&nbsp;&nbsp;&nbsp;使用效果后的文字
</font>
</body>
</html>

3. 设置文字标注标记<ruby>

在HTML文件中,有时需要对某个字、词或者某个段进行说明,可以通过添加文字的标注标记来完成对网页中文字的说明。

基本语法:

<ruby>
被说明的文字
<rt>
文字的标注
</rt>
</ruby>

语法说明:

利用成对的<ruby><rt>标记,可以对网页中的文字进行标注。

实例代码

<html>
<head> 
<title>设置文字标注标记</title>
</head>
<body><ruby>当代最可爱的人<rt>志愿军</rt>
</ruby>
</body>
</html>

三、文字修饰

1.简单修饰文字

基本语法

<body>
普通文字的显示<br>
<b>加粗的文字</b><br>
<i>斜体的文字</i><br>
<u>添加下划线的文字</u><br>
<big>放大</big><br>
<small>缩小</small><br>
</body>

实例代码:

<html>
<head> 
<title>简单修饰文字</title>
</head>
<body>普通文字的显示<br><b>加粗的文字</b><br><i>斜体文字</i><br><u>添加下划线文字</u><br>
</body>
</html>

2. 确定文字上下标

基本语法:

<body>
<sup>上标内容</sup><br>
<sub>下标内容</sub><br>
</body>

语法说明:

在HTML文件中,成对的<sup></sup>标记可以表示上标,利用成对的标记<sub></sub>表示下标。

实例代码:

<html>
<head>
<title>确定文字上下标</title>
</head>
<body>解下面方程:<br>x<sup>2</sup>-3x+2=0<br>解:x<sub>1</sub>=1; x<sub>2</sub>=2<br>
</body>
</html>

3.设置地址文字

在网页中添加地址文字,是为了更方便地突出显示联系方式,将联系人的地址信息突出显示。

基本语法:

<body>
<address>请在此添加地址信息</address>
</body>

语法说明:

在HTML文件中,利用成对<address></address>标记就可以将网页需要显示的地址文件突出显示。

实例代码:

<html>
<head> 
<title>设置地址文字</title>
</head>
<body>书中有不恰当的地方,请您及时与我们联系:<br><address>清华大学出版社</address><br><address>E-mail:market@1.com.cn</address><br>
</body>
</html>

这篇关于超文本标记语言(html)之文字编辑的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/384825

相关文章

Vue和React受控组件的区别小结

《Vue和React受控组件的区别小结》本文主要介绍了Vue和React受控组件的区别小结,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学... 目录背景React 的实现vue3 的实现写法一:直接修改事件参数写法二:通过ref引用 DOMVu

Java实现将HTML文件与字符串转换为图片

《Java实现将HTML文件与字符串转换为图片》在Java开发中,我们经常会遇到将HTML内容转换为图片的需求,本文小编就来和大家详细讲讲如何使用FreeSpire.DocforJava库来实现这一功... 目录前言核心实现:html 转图片完整代码场景 1:转换本地 HTML 文件为图片场景 2:转换 H

C#使用Spire.Doc for .NET实现HTML转Word的高效方案

《C#使用Spire.Docfor.NET实现HTML转Word的高效方案》在Web开发中,HTML内容的生成与处理是高频需求,然而,当用户需要将HTML页面或动态生成的HTML字符串转换为Wor... 目录引言一、html转Word的典型场景与挑战二、用 Spire.Doc 实现 HTML 转 Word1

Vue3绑定props默认值问题

《Vue3绑定props默认值问题》使用Vue3的defineProps配合TypeScript的interface定义props类型,并通过withDefaults设置默认值,使组件能安全访问传入的... 目录前言步骤步骤1:使用 defineProps 定义 Props步骤2:设置默认值总结前言使用T

GO语言短变量声明的实现示例

《GO语言短变量声明的实现示例》在Go语言中,短变量声明是一种简洁的变量声明方式,使用:=运算符,可以自动推断变量类型,下面就来具体介绍一下如何使用,感兴趣的可以了解一下... 目录基本语法功能特点与var的区别适用场景注意事项基本语法variableName := value功能特点1、自动类型推

GO语言中函数命名返回值的使用

《GO语言中函数命名返回值的使用》在Go语言中,函数可以为其返回值指定名称,这被称为命名返回值或命名返回参数,这种特性可以使代码更清晰,特别是在返回多个值时,感兴趣的可以了解一下... 目录基本语法函数命名返回特点代码示例命名特点基本语法func functionName(parameters) (nam

Go语言连接MySQL数据库执行基本的增删改查

《Go语言连接MySQL数据库执行基本的增删改查》在后端开发中,MySQL是最常用的关系型数据库之一,本文主要为大家详细介绍了如何使用Go连接MySQL数据库并执行基本的增删改查吧... 目录Go语言连接mysql数据库准备工作安装 MySQL 驱动代码实现运行结果注意事项Go语言执行基本的增删改查准备工作

Go语言使用Gin处理路由参数和查询参数

《Go语言使用Gin处理路由参数和查询参数》在WebAPI开发中,处理路由参数(PathParameter)和查询参数(QueryParameter)是非常常见的需求,下面我们就来看看Go语言... 目录一、路由参数 vs 查询参数二、Gin 获取路由参数和查询参数三、示例代码四、运行与测试1. 测试编程路

Go语言使用net/http构建一个RESTful API的示例代码

《Go语言使用net/http构建一个RESTfulAPI的示例代码》Go的标准库net/http提供了构建Web服务所需的强大功能,虽然众多第三方框架(如Gin、Echo)已经封装了很多功能,但... 目录引言一、什么是 RESTful API?二、实战目标:用户信息管理 API三、代码实现1. 用户数据

Go语言网络故障诊断与调试技巧

《Go语言网络故障诊断与调试技巧》在分布式系统和微服务架构的浪潮中,网络编程成为系统性能和可靠性的核心支柱,从高并发的API服务到实时通信应用,网络的稳定性直接影响用户体验,本文面向熟悉Go基本语法和... 目录1. 引言2. Go 语言网络编程的优势与特色2.1 简洁高效的标准库2.2 强大的并发模型2.