【Web前端】网页设计-HTML5的基本语法规则&&简单文字效果

一杯星星海

已于 2022-08-23 18:25:21 修改

阅读量772

点赞数 2

文章标签：前端 html5 javascript

于 2022-07-31 15:55:13 首次发布

本文链接：https://blog.csdn.net/qq_63237942/article/details/126086500

版权

前言

本文将进一步总结一些编排网页内容所需要用到的基础知识。

本文很多内容来源于对书本知识的归纳，若文章侵权，请联系作者删除。

文章目录

前言
1. HTML5的基本语法规则
2. 网页文字效果
- 2. 1. 空格与特殊符号
- 2. 2. 文字样式与修饰

1. HTML5的基本语法规则

HTML的语法分为3部分：标记语法，属性语法，注释标记。

1. 1. 标记语法

标记有双标记和单标记两种。

双标记：
由”开始标记“和”结束标记“两部分组成。“开始标记”就是该标记功能开始执行的地方，“结束标记”也是字面意思。

语法：<标记名>内容</标记名>

提醒：标记名与两端的尖括号之间都没有空格

例：表示正文部分的<body>和</body>。

如果学过C语言，可以感觉到，标记的开始和结束，就和成对出现的花括号有些类似。

单标记：
单标记没有开始和结束的区分，一个单独的标记就能表达完整的意思。
例：表示换行的 

1. 2. 属性语法

为标记附加的一些信息，被称为属性。

语法：<标记名属性名1="属性值"属性名2=“属性值”>

例：<body text="red">大家好！</body>将“大家好！”以红色字呈现。
注意：引号需使用半角（英文输入法）

1. 3. 注释标记

注释部分会被浏览器忽略而不显示。可以用于解释代码，以避免自己写的代码日后自己看不懂。

语法：<!–注释内容-- >

注意：中间是不需要任何空格的。我右边留有一个空格，因为markdown编辑器也支持html语法，我要是不加，就真的变成注释看不到了。

除了作为解释，注释语句还有另一个用处。我们看下面这段代码：

<body>
	<script type="text/javascript">
		<!--
			document.write("欢迎访问本站")
		-->
	</script>
	<noscript>您的浏览器不支持JavaScript！</noscript>
</body>

这就形成了一个条件分支语句，仅当满足script type="text/javascript"时，才会展示语句欢迎访问本站，否则显示您的浏览器不支持JavaScript。这样可以避免不支持样式的浏览器把它显示为纯文本。

2. 网页文字效果

2. 1. 空格与特殊符号

空格：
通常，HTML会自动删除文字内容中多余的空格（连续的通过空格键添加的空格，将被视为一个空格）。如需添加连续的多个空格，可使用 （表示一个空格）。

不过，当我们需要3个连续的空格时，并不一定得使用三个 ，用空格 空格 即可达到目标效果。

特殊符号：
像空格就是一种特殊符号，可以用 表示，其它特殊符号也有这样使用符号代码来表示的方法。

具体的符号与代码的对应关系，可自行网上查找，比较全面。

2. 2. 文字样式与修饰

标记：
标记在HTML5已经停用，HTML5中文字样式可通过CSS实现。鉴于兼容性，这里仍使用标记实现文字样式。
关于这个兼容性的问题，我也没弄明白

语法：…

face定义字体，系统默认的是宋体。可以一次定义多个字体，用逗号隔开；若前一个字体在系统中不存在，则显示下一个。
size设置字号，系统默认值为3。可以直接指定字号，如size="5"表示设置字号为5。也可使用相对字号大小，如size="+2"表示也设置字号为5（默认的3再加上2）。
color设置文字颜色，可使用英文单词，如color="red"将文字设置为红色；也可用对应的16进制数值，具体对应关系可以自己上网查找。

还有一个标记< basefont >，称为基地文字标记，即没有另外设置样式时，文字的默认样式。语法与标签相似，仅仅是开始标签改为< basefont >(但是结束标签一样）。

文字修饰：
这里介绍粗体，斜体，上标和下标。

标签	效果
< b >…< /b >	文字加粗
< i >…< /i >	文字倾斜
< sup >…< /sup >	文字作为上标显示，如a²
< sub >…< /sub >	文字作为下标显示，如a₂