4.3 KiB
4.3 KiB
HTML 简介
什么是HTML
HTML (超文本标记语言 ) 不是一门编程语言，而是一种用于定义网页内容的含义和结构 的标记语言 ，全称 超文本标记语言。由一系列元素（element）组成。
HTML 通过标记（markup） 来标明文本，图片和其他内容 ，除 HTML以外的其他技术则通常用来描述一个网页的表现与展示效果（通过css） 或功能行为 （js）
html 基本结构
一个html 的基本 结构如下：
用于在html文件中插入 注释
<!DOCTYPE html> <!-- 文档声明 -->
<html> <!-- <html></html> 定义文档整体 -->
<head> <!-- <head></head> 对页面进行设置，定义标题，外链css,js文件等 -->
<meta charset="UTF-8"> <!-- 定义网页的编码格式 -->
<title>Document</title> <!-- 定义页面标题 -->
</head>
<body> <!-- 编写网页上显示的内容 -->
</body>
</html>
HTML 标签（元素）
分类方式：
- 有无闭合标签：
- 单标签 没有闭合标签 单标签内以 /结尾 如：
- 双标签 由开始标签+内容+结束标签 构成 如 ：
hello world
- 块级元素
- 定义：块级元素占据其父元素（容器）的整个空间 ，通常浏览器会在块级元素前后另起一个新行，即会导致换行
- 示例：
- 大区块元素 div
- 段落元素 p
- 表格元素 table
- 列表元素 ul , ol, li
- 滚动元素 marquee
- 水平线元素 hr
- 标题元素 hn (h1!~h6)
- 内联元素
- 定义：通常出现在块级元素中，包裹文档内容的一小部分，不会导致换行
- 示例
- 超链接 a
- 文本区域 span
- 表格标签 label
- 斜体 i
- 加粗 b, em, strong
- 多行文本输入框 textarea
常用标签详解
- 段落标签
<p>我是段落标签</p>
-
列表元素
-
有序列表 （ol-li）
-
属性：
- reversed 布尔值 值为true/false 指定编号是否为从高到低反向排列
- start 一个整数值属性 值应该是数字 指定列表的起始值
- type 设置编号的类型 可选值如下：
- 1 数字编号 （默认）
- a 小写英文字母编号
- A 大写英文字母编号
- i 小写罗马数字编号
- I 大写罗马数字编号
start 和type 在html4中被废弃 但是在html5 中被重新引入
<ol> <li>列表中第一列的内容</li> ... 更多列 </ol>效果如下：
-
-
无序列表 （ul -li）
-
常用属性
- type
- circle 空心圆
- disk 实心圆
- square 方块
-
<ul> <li> 列表中第一项的内容</li> </ul>
-
-
hr 水平线
-
hn 标题元素
-
空元素 没有内容的html 元素叫空元素
-
h1~h6标题
-
a 超链接
- 属性 href 指定跳转到的网址
- 具有默认的样式
元素嵌套
-
嵌套规则：
-
块元素可以包含内联元素或某些块元素，但内联元素却不能包含块元素，它只能包含其它的内联元素
-
块级元素不能放在
里面
-
有几个特殊的块级元素只能包含内嵌元素，不能再包含块级元素，这几个特殊的标签是：
h1、h2、h3、h4、h5、h6、p、dt
-
li 内可以包含 div 标签 li 和 div 标 签都是装载内容的容器，地位平等，没有级别之分
-
块级元素与块级元素并列、内嵌元素与内嵌元素并列
-
<div> <h2></h2> <p></p> </div> —— 对 块级元素嵌套内联元素和块级元素 <div> <a href=”#”></a> <span></span> </div> —— 对 块级元素嵌套内联元素 <div> <h2></h2> <span></span> </div> —— 错 h2 是块级元素 span 是内联元素 块级元素不能喝内联元素并列
-
-
HTML 特殊符号
HTML 常用的特殊字符：
-   空格
- © 版权 ©
- ® 已注册 ®