HTML+CSS基础入门-第一天（HTML-HTML语法）

痛定思痛。 2022-09-29 06:34 160阅读 0赞

> 本博客为线上学习某课程笔记，供参考，供学习

## 什么是HTML标记语言？ ##

表示网页信息的符号标记语言。

## 开发工具 ##

自带笔记本 等编辑器 我这里用：NotePad++

## HTML语言特点。 ##

*  可以设置文本的格式，比如标题，字号，文本颜色，段落等等。
 *  可以创建列表
 *  可以插入图像和媒体
 *  可以建立表格
 *  超链接，可以使用鼠标点击超链接来实现页面之间的跳转

## HTML的标记和他的属性 ##

1.  HTML文档的保存格式： .html .htm .xhtml
2.  标记和被标记的内容构建出HTML文档  
    格式：
    
        <标记>
                内容
        </标记>
    
    例如：在编辑器中写下以下代码 保存为.html文件
    
        <html>
            <body>
                Hello word！
            </body>
        </html>
    
    在浏览器中打开此文件可看网页中出现1-1，咱们写了第一个程序，有点小激动。

![1-1][]

1.  标记的属性

标记的属性就是用来控制我们的内容（图像，文本等的）如何显示

格式：

<标记 属性1=属性值 属性2=属性值 .......>
        内容
    </标记>

例如

<html>
        <body bgcolor="red">
            Hello word！
        </body>
    </html>

在浏览器中打开此文件可看网页中出现1-2，可见背景变成了红色，也就是说”bgcolor”这个属性是标记背景颜色的，大家可以换个颜色试试。

![1-2][]

## 语法不区分字母大小写 ##

” <HTML> <Html> <html> ” 都是定义相同的标记，但是在编写网页的时候尽量使用小写

## 文档注释 ##

例如

<html>
        <body >
            我是显示出来的语言
            
        </body>
    </html>

大家可自行到网页上查看效果

## 代码格式 ##

空格键和回车键在网页中不会起到任何作用，我们为了让代码清晰易读，可以使用空格和回车键进行编排

注意：缩进时保持严格的规则，以“tap”键进行缩进

## 字符实体 ##

### 什么是字符实体 ###

比如我们想在网页上显示一个”<”小于符号，但是”<”在HTML中是文档标记的开始语言，如果我们直接用”<”会出错，所以我们就会用一些实体名称来代替.  
例如：

浏览器显示结果为  
![1-4][]

### 常见的字符实体 ###

![1-3][]

[1-1]: /images/20220708/29e05319b91649c1b389c58e48a173fb.png
[1-2]: /images/20220708/b9265fd80f0d4357adceb5d9f84319a0.png
[1-4]: /images/20220708/52e30e26dadd4b5b9b41600aca4a8642.png
[1-3]: /images/20220708/fc055fc047804a2aae88b04b67dfb9f5.png