一、HTML
1、HTML概述
HTML(HyperTextMarkupLanguage)就是超文本标记语言,“超文本”就是表示页面可以包含非文字元素,如:图片、链接、音乐等
1.1、基础语法
1.1.1、单标签
- 无属性单标签
- 有属性单标签
1.1.2、双标签
- 无属性双标签
- 有属性双标签
1.2、整体结构
1.2.1、head
- title:
- 页面的名字
- 页面收藏的名称
- link
- 引入css文件
- script
- 用来引入js文件或编写js代码
1.2.2、body
- 想要看到的东西放到body中
2、常用标签
2.1、标题
h1~h6,大小以此递减
自带换行的效果
块级元素
- PS
- 加粗只用标题
- 尽量减少使用h1标签,h1用多了会被搜索引擎拉黑,因为搜索引擎是按标题标签从上到下依次搜索的
2.2、段落标签
p标签,会自动换行
块级元素
2.3、换行标签
单标签,使用<br><be/>其中之一即可
2.4、水平线标签
<hr>单标签
常用属性
- color 颜色
- size 粗细
- width 长度(百分比 或 px)
- align 对齐方式
2.5、列表标签
2.5.1、无序列表
type的值可选,能改变标号的样式
<ul type="square" >
<li> 这里是内容1 </li>
<li> 这里是内容2 </li>
</ul>
2.5.2、有序列表
type的值也可选,能改变序号的样式
<ol type="1" >
<li> 这里是内容1 </li>
<li> 这里是内容2 </li>
</ol>
2.6、 div & span
2.6.1、div标签(块)
块级元素,用来做页面布局
默认占全部的宽度,有多少内容高度就占多少
可以设置div的宽(width)、高(height)
通过align设置内容的对齐方式
<div style="width:500px; height:100px;" align="center">
这是一个div
</div>
2.6.2、span标签(行)
行内元素,不会自动换行
不能设置宽高,有多少内容就占多少空间
<span> 这是一个span </span>
2.7、格式化标签
2.7.1、font
规定文本的字体、字体尺寸、字体颜色
- color:字体颜色
- size:字体尺寸
- face:字体风格
<font color="aqua" size="5" face="楷体">你好</font>
2.7.2、pre
定义预格式化的文本,保留空格和换行符,而文本也会呈现为等宽字体
<pre>Hello World</pre>
  Hello World
2.7.3、文本标签
- b:加粗(strong也可以加粗)
- i:斜体
- u:下划线
- del:中划线
- sub:下标文本
- sup:上标文本
2.8、a标签
a标签定义超链接,用于从一张页面链接到另一张页面
- href属性:它指示要链接的目标位置,如果没有href属性,a标签内的内容与普通文本没有区别,也就失去了超链接的功能
- 跳转到当前页面,那么href的值为#,被链接页面通常显示在当前浏览器窗口中,除非规定了另一个目标(target属性)
- target
- _blank:开启新页面显示页面
- _self:当前页面显示跳转到页面,默认值
- 作为锚点
- a标签的name属性
<a name="top"></a>
- 其他标签的id属性值
<div id="top"></div>
- 锚点的使用:
<a href="#top"></a>
- PS:此处的top可以换为任意字符
- a标签的name属性
2.9、图片
<img src=" " alt=" " >
2.10、表格
table
- tr:定义表格的行,tr元素包含一个或多个th或td元素
- td:定义HTML表格中的标准单元格
- th:定义表格内的表头单元格,th元素内部的文本通常会呈现为居中的粗体文本,而td元素内的文本通常是左对齐的普通文本
常用属性
- 合并表格的边框
<table border="1" style="border-collapse: collapse;">
tr常用属性
- td的colspan和rowspan分别规定单元格横跨的列数和行数