HTML
- HTML简介
HTML是用来制作网页的语言
HTML:HyperText MarkUp Language 超文本标记语言
超文本:超:超链接 包含超链接的文本
标记语言:
标记:标签
语言:制作网页的语言
一个网页是有多个标签组成的
- 语法介绍
html是由浏览器来解析,所以不需要安装任何编译环境
Html文档的基本结构:
<!DOCTYPE html> 声明文档类型
<html> 是网页当中最大的标签,所有内容都要写在html标签内
<head> head头 主要用于书写网页的设置 一般写不直接显示给用的内容
字符编码的设置
title标签 网页的标题
style标签 引入外部的css文件
script标签 引入外部的JavaScript 文件
Body: body体,网页的主体部分,网页中只要是显示给用户的内容,都要写在此标签。
Head,和body 都是html的子标签。
Html标签写法分类:
双标签:<标签名></标签名> / <开始标签>内容</结束标签>
单标签: <标签名 /> 一般写成<标签名>
Html标签的属性:
一般是键值对 key=”value”
注意事项:
Html不会报错 所以注意双标签不要忘了闭合
Html标签不区分大小写 规范要求都是用小写
- html使用 标签
- h1-h6 标题标签
双标签 有默认样式 字体变粗 变大 变黑 会自动换行
一般一个页面中h1只使用一次 h2-h6可以使用多次
- p 段落标签
双标签 有默认的样式 会自动换行
- 常见的转义字符
空格
> 大于号
< 小于号
© 版权标志
- i 标签 b标签 em 标签 strong标签 u标签
i标签 单纯的字体斜体
em 也是斜体 只不过具有强调意义,方便搜索引擎搜索
b 加粗,为了加粗而加粗
strong 加粗,为了标明重点而加粗,方便搜索引擎搜索
u 下划线
以上都是双标签
- br hr
都是单标签
br 强制换行
hr 水平线
- img 图片标签
单标签
属性:
src 图片的地址
title 鼠标移入的提示信息
alt 图片加载失败时的替代内容
可以使用网络图片或者本地的图片
使用的是本地的图片资源
相对:相对于当前文件来去查找指定的资源
./ 代表当前路径
../ 代表上一级路径
绝对路径: 不考虑当前文件的位置,从根目录去查找指定的资源
推荐使用相对路径
- 列表标签
无序列表
ul: 声明一个无序列表
li: 列表项
type属性(了解):
默认disc 圆
square 方块
circle 空心圆
ul中的直接子元素必须是li
有序列表
ol:声明一个有序列表
li: 列表项
type:
1 代表数字 默认就是数字
a 代表小写字母
A 代表大写字母
i 小写的罗马数字
I 大写的罗马数字
start: 指定以第几个开始 只能写数字
自定义列表
dl:声明一个自定义列表
dt:列表的标题
dd:列表描述项
- a 标签超链接
超连接a 双标签
页面跳转
href: 跳转的地址
如果不给值 跳转当前页面
target:_blank 新打开一个窗口加载跳转后的页面
跳转到当前页面的指定位置 锚点
给指定标签添加id属性
a标签的href属性的值为#指定元素id属性的值
跳转到 本地html文件的指定位置
a标签的href属性的值为指定页面中标签的id的值
- 表格标签
table: 声明一个表格
border: 边框
cellspacing: 设置格和格之间的间距
cellpadding: 设置表格中内容距离当前表格边框之间的间距
tr: 声明一个行
td/th: 声