1.html的定义： HTML全称为Hyper Text Markup Language，即超文本标记语言。 2.html中的语法：
-
在尖角符号后面的第一个英文单词就是当前标记的名称
-
标记也可以称为标签或者元素
-
双标签结束的反斜杠不能省略 但是单标签的反斜杠是可以省略的
-
在标签名称后面空格都是当前标签的属性(描述当前标签)
-
属性和属性值之间需要使用=号相连,属性值需要使用引号引起来
-
属性有多个的时候不区分前后顺序
3.一些常见的标签及使用： div:是一个没有任何含义的盒子 用来作为网页布局的
span:是一个没有任何含义的盒子 用来包裹文字的
--文本标题标签的使用
1.标签的名称:h 有六个 h1、h2、h3、h4、h5、h6
2.标签的默认样式
- h1到h6的字体越来越小
- h1到h6的加粗效果越来越弱
- 默认会独占一行并且换行
- 字体上下会有间距
3.标签的作用
- h1用来存放当前网页中最为重要的部分(主题文本或者是logo)
- h2~h6没有固定的用法,可以表示标题
-- 段落标签的使用
1.标签的名称:p
2.默认样式
- 独占一行并且换行
- 上下有间距
- 段落标签会默认在一行 宽度根据当前的可视区域进行变化
--加粗标签
1.标签名称:b、strong
2.区别:b和strong之间是有区别的 后者的加粗多一点 但是浏览器区分不明显 肉眼不可见
3.strong标签表示语气加强
--倾斜标签
1.标签名称:i、em
2.区别:i和em之间是有区别的 后者的倾斜多一点 但是浏览器区分不明显 肉眼不可见
3.em标签表示语气加强、
-- 删除线标签的使用: del、s
--下划线标签的使用: u
-- 上标和下标:sup sub
-- 两个单标签的使用
- br 强制性换行
- hr 水平线
常见的列表标签有三种表达形式:无序列表、有序列表、自定义列表 一.无序列表
1.标签名称:
- ul父级标签 表示列表的盒子
- li子级标签 表示列表中的内容
2.默认样式
- 无序列表默认的符号是黑色的实心圆
- 独占一行并且换行
- 如果需要有多个子级的时候 书写li即可
3.属性:type类型
- disc 实心圆
- circle 空心圆
- square 方形
4.常用于新闻列表页面或者一些轮播图
二:有序列表
1.标签名称:
- ol父级标签 表示列表的盒子
- li子级标签 表示列表中的内容
2.默认样式
- 有序列表的默认符号是序号 默认是1
- 独占一行并且换行
- 如果需要有多个子级的时候 书写li即可
3.属性
type类型 - A/a I/i
start开始 - 属性值只能是数字 表示从第几个开始数的
4.常用于新闻列表页面或者一些轮播图
三:自定义列表
1.标签名称
- dl父级标签 表示列表盒子
- dt+dd子级
2.默认样式
- 文本是有缩进效果的
- 当子级元素较多的时候不可以写在一起
图片标签的使用 1.标签名称:img单标签
2.标签中的属性应用
- src 设置图片的路径
- alt 提示文本(当图片加载失败的时候)
3.只需要了解的属性:width/height/border 宽度/高度/边框 单位像素px
路径的使用(Image preview) 1.绝对路径的使用:这种方式只能在自己电脑中使用 不可以在工作中使用
- 含有盘符的路径地址
2.相对路径的使用
- 同级找同级:目标文件的名称.后缀名
- 父级找子级:目标文件的文件夹/目标文件的名称.后缀名
超链接标签的使用:点击可以跳转到相应的页面 1.标签名称:a
2.属性
- href 路径
- target 目标 _self 打开会覆盖原窗口 _blank 打开新窗口
3.默认样式
- 没有设置href属性值的时候默认字体颜色是紫色
- 设置href属性值的时候默认字体颜色是蓝色
- 文本有下划线
表单的使用:收集用户信息 1.表单框/表单域
- 标签名称:form
- 标签作用:就是一个盒子 让用户填写个人信息的 默认在浏览器中是不显示的
- action 行为动作 地址
- method 方法方式 前后端交互的方式 get/post
- get携带参数,post不会携带参数
- get相对于post而言 安全低一些
- 在参数前面的问号的意思:接参数
2.表单控件:表单框就是一个盒子在浏览器中是看不见 需要在表单框中让用户填写个人信息 需要表单控件
- 标签名称:input单标签
- type属性:默认的属性值text 表示文本框
表单控件的使用(现在的是H4) 1.属性
- type 类型 可以设置成不同的效果
- name 姓名/名字 记录数据保存
- value 提示文本 占位置 用户输入个人信息的时候需要手动删除
- placeholder 提示文本 不占位置 HTML5里面新增的属性 占位符
2.属性值
- text 默认为文本输入框
- password 密码框
- radio 单选 设置相同的name属性即可
- checkbox 多选
- 默认选择 checked
- 禁止选择 disabled
3.功能按钮:需要放在form表单域中才会有作用
- submit 提交按钮
- reset 重置按钮
4.特殊的空按钮标签
- input中type类型为button 需要绑定js事件才有意义
- button标签 需要绑定js事件才有意义 会跳转页面和submit的作用一样(默认提交一次)
