Skip to content

HTML基本语法

编辑器和浏览器介绍

代码编辑器

sh
webstorm
vscode
Hbuilder
sublime text
Atom
Brackets
NodePad++
EditPlus
Vim
Dreamweaver

浏览器

sh
拥有自己内核的浏览器: 
Chrome、Safari、Firefox、IE、旧版Opera。

使用 Chrome 内核的浏览器: 
Edge、360安全浏览器、360极速浏览器、搜狗浏览器、UC浏览器、猎豹浏览器、夸克浏览器、海豚浏览器、傲游浏览器、QQ浏览器、2345浏览器 、新版Opera等

前端技术的应用

sh
1. 网页 H5程序
2. 手机App(ios、安卓)
3. 混合可发(嵌入到原生开发的安卓应用、ios应用)
4. windows 应用、 macos 应用、linux应用
5. 小程序(微信、支付宝等)
6. 安卓快应用
7. Node.js 开发服务端
8. JavaScript 开发各种小工具

Markdown 的用法

markdown 格式

sh
# 一级标题
## 二级标题
### 三级标题
#### 四级标题
##### 五级标题
###### 六级标题

* 列表项内容
* 列表项内容
* 列表项内容
* 列表项内容

**强调加粗**

分隔线
***

```
代码块
```

这段程序中 `var a = 100` 起到了至关重要的作用。

没有任何格式的普通文本内容,多个空格只能显示为一个。

typora - markdown 编辑工具

js
可见即可得

HTML 基本语法

HTML 文件

js
1. 扩展名是 .html 的文件称为网页文件或者HTML文件
2. HTML 文件使用代码编辑进行编辑,使用浏览器查看效果

文档声明

html
<!Doctype html>
js
告诉浏览器所使用的的HTML标准,采用标准模式渲染页面,避免进入怪异模式

基本页面模板

html
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>小乐的交友网站</title>
    </head>
    <body>
    </body>
</html>

HTML 标签

1. 标签是 HTML 的基本组成,也叫元素
2. 标签里面可以包裹标签, 被包裹的标签一定要缩进,同级的标签一定要对齐
3. 标签分为双标签和单标签
   双标签由开始标签和结束标签组成,结束标签需要 /
   单标签也称为自闭和标签,标准中也有 / ,可以省略
4. 标签具有语义,语义决定什么时候使用该标签
5. 标签名不区分大小写
html
<标签名>内容</标签名>
<标签名 />
<标签名>

标签的属性

html
1. 属性是属于标签的,不同的标签有不同的属性
2. 属性由属性名和属性值组成,属性值使用单引号或双引号包裹,或者不使用引号
3. 标签中,同名的属性不能设置多次,如果设置后面的属性不会生效
4. 属性不区分大小写
html
<标签名 属性名1="属性值" 属性名2="属性值"></标签名>

如何掌握一个 HTML 标签

js
1. 标签的语义和功能
2. 该标签有哪些属性以及属性的值如何设置
3. 该标签是单标签还是双标签

HTML 注释

html
<!-- 这是注释内容 -->
<!--
    这是注释的内容
    这是注释的内容
    这是注释的内容
    这是注释的内容
-->

注释的作用:

js
1. 对代码解释说明
2. 暂时不想执行的代码可以注释掉