超文本标记语言(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

相关文章

深入理解Go语言中二维切片的使用

《深入理解Go语言中二维切片的使用》本文深入讲解了Go语言中二维切片的概念与应用,用于表示矩阵、表格等二维数据结构,文中通过示例代码介绍的非常详细,需要的朋友们下面随着小编来一起学习学习吧... 目录引言二维切片的基本概念定义创建二维切片二维切片的操作访问元素修改元素遍历二维切片二维切片的动态调整追加行动态

Go语言中make和new的区别及说明

《Go语言中make和new的区别及说明》:本文主要介绍Go语言中make和new的区别及说明,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录1 概述2 new 函数2.1 功能2.2 语法2.3 初始化案例3 make 函数3.1 功能3.2 语法3.3 初始化

Go语言中nil判断的注意事项(最新推荐)

《Go语言中nil判断的注意事项(最新推荐)》本文给大家介绍Go语言中nil判断的注意事项,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考下吧... 目录1.接口变量的特殊行为2.nil的合法类型3.nil值的实用行为4.自定义类型与nil5.反射判断nil6.函数返回的

Go语言数据库编程GORM 的基本使用详解

《Go语言数据库编程GORM的基本使用详解》GORM是Go语言流行的ORM框架,封装database/sql,支持自动迁移、关联、事务等,提供CRUD、条件查询、钩子函数、日志等功能,简化数据库操作... 目录一、安装与初始化1. 安装 GORM 及数据库驱动2. 建立数据库连接二、定义模型结构体三、自动迁

Go语言代码格式化的技巧分享

《Go语言代码格式化的技巧分享》在Go语言的开发过程中,代码格式化是一个看似细微却至关重要的环节,良好的代码格式化不仅能提升代码的可读性,还能促进团队协作,减少因代码风格差异引发的问题,Go在代码格式... 目录一、Go 语言代码格式化的重要性二、Go 语言代码格式化工具:gofmt 与 go fmt(一)

前端如何通过nginx访问本地端口

《前端如何通过nginx访问本地端口》:本文主要介绍前端如何通过nginx访问本地端口的问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录一、nginx安装1、下载(1)下载地址(2)系统选择(3)版本选择2、安装部署(1)解压(2)配置文件修改(3)启动(4)

HTML中meta标签的常见使用案例(示例详解)

《HTML中meta标签的常见使用案例(示例详解)》HTMLmeta标签用于提供文档元数据,涵盖字符编码、SEO优化、社交媒体集成、移动设备适配、浏览器控制及安全隐私设置,优化页面显示与搜索引擎索引... 目录html中meta标签的常见使用案例一、基础功能二、搜索引擎优化(seo)三、社交媒体集成四、移动

HTML input 标签示例详解

《HTMLinput标签示例详解》input标签主要用于接收用户的输入,随type属性值的不同,变换其具体功能,本文通过实例图文并茂的形式给大家介绍HTMLinput标签,感兴趣的朋友一... 目录通用属性输入框单行文本输入框 text密码输入框 password数字输入框 number电子邮件输入编程框

HTML img标签和超链接标签详细介绍

《HTMLimg标签和超链接标签详细介绍》:本文主要介绍了HTML中img标签的使用,包括src属性(指定图片路径)、相对/绝对路径区别、alt替代文本、title提示、宽高控制及边框设置等,详细内容请阅读本文,希望能对你有所帮助... 目录img 标签src 属性alt 属性title 属性width/h

CSS3打造的现代交互式登录界面详细实现过程

《CSS3打造的现代交互式登录界面详细实现过程》本文介绍CSS3和jQuery在登录界面设计中的应用,涵盖动画、选择器、自定义字体及盒模型技术,提升界面美观与交互性,同时优化性能和可访问性,感兴趣的朋... 目录1. css3用户登录界面设计概述1.1 用户界面设计的重要性1.2 CSS3的新特性与优势1.