1、 什么是HTML?
HTML是一种超文本标记语言(HyperText Markuop Language) 。超文本指的是页面可以包含图片、链接、以及音乐、程序等非文字元素。
- 超文本标记语言的主要结构包括"头部"(head)和"主体"(body)部分。其中"头"部提供关于网页的信息,"主体"部分提供网页的具体内容。
2、HTML的基本结构
- 由WebStorm生成的html基本结构:
<!DOCTYPE html>
<html lang="en">
<head><!-- 头部-->
<meta charset="UTF-8"><!-- 编码方式-->
<title>Title</title>
</head>
<body><!-- 主体-->
</body>
</html>
3、HTML元素
-
元素语法:
1.HTML元素以开始标签起始,以结束标签终止。
2.元素的内容是开始标签与结束标签之间的内容。
3.某些html元素具有空内容(empty content)。
4.空元素在开始标签内进行关闭(以开始标签的结束而结束,如“”)。
5.大多数html元素可拥有属性。 -
html元素分类
在html中,标签元素大致被分为三种不同类型,分别是块状元素、内联元素、和内联块状元素。
1.块状元素的特点:
a.元素独占一行
b.宽高可设置(宽高包括content(内容)的宽高、行高(line-height)、内边距(padding)、外边距(margin)、边框(border))
2.内联元素的特点:
a.和其他元素在同一行(不能喝块状元素在同一行)
b.宽高不可设置,其宽高由其中所填的内容决定
3.内联块状元素的特点:
a.
元素类型 | 特点 | 常见元素 |
---|---|---|
块状元素 | a.元素独占一行 b.元素的宽高可设置(宽高包括content(内容)的宽高、行高(line-height)、内边距(padding)、外边距(margin)、边框(border)) | div、p、h1、ol、ul、dl、table、form " |
内联元素 | a.和其他元素在同一行(不能喝块状元素在同一行) b.宽高不可设置,其宽高由其中所填的内容决定 | a、span、br、i、em、b、strong、lable |
内联块状元素 | a.与其他元素可以在同一行中 b.元素的宽高可设置(宽高包括content(内容)的宽高、行高(line-height)、内边距(padding)、外边距(margin)、边框(border)) | img、input |
- 注意:不同类型的元素之间可以通过display属性互相装换。