HTML简单学习
介绍：如果你想让你的网页在浏览器中正常显示，你就必须遵循HTML标签
HTML文件的后缀名是.html
HTML文档介绍：
head标签一般写的不是让用户看的
body标签一般写什么内容，浏览器中就能够看到什么内容，给用户看的
body中常用的标签
基本标签
加粗
斜体
下划线
删除
段落标签
标题1
标题2
标题3
标题4
标题5
标题6
换行标签:
水平线标签:
标签的分类一
块儿级元素
# 独占一行，不管自身有多大，他自己就占一行
h1标题标签都是
p标签
hr标签
行内元素(内联元素)
# 自身文本有多大就占多大，不会独占一行
加粗
斜体
下划线
删除
标签的分类二
双标签
加粗
斜体
下划线
删除
h1标题标签都是
p标签
a标签
单标签
hr标签
br标签
img标签
特殊字符(实体符号)
内容 对应代码
空格
> >
< <
& &
¥ ¥
版权 ©
注册 ®
div标签和span标签
div标签
span标签
这两个标签没有实际的意义，一般用来'布局'使用
div它是块儿级元素，给页面占布局
span标签是行内元素，用来给文本内容占布局
标签的嵌套
我们使用亲戚关系来表示标签之间的关系
#p标签是div标签的儿子，是span标签的父标签
#span标签是p的儿子，是div的孙子
# p标签是div标签的儿子，是p标签的兄弟，也是span的兄弟标签
"""
注释事项:
块级儿级元素能够嵌套所有的行内元素，块儿级元素也能够嵌套所有的块儿级元素，但是出了p标签之外
行内元素不能够嵌套块儿级元素，但是可以嵌套所有的行内元素
"""
前端里面一般不会轻易的报错!!!!!!!!，你写的代码不正确不规范，没有效果而已，但是不会报错.
前端是跟用户打交道的，不能随随便便的报错，要不然体验很差
img标签
标签会有属性：
1. 自带的属性
2. 自定义的属性
eg: 
src:写图片的地址
1. 外链地址
2. 相对地址
alt：
当图片地址加载失败的时候，显示的描述性信息
width="800px" height="200px"
控制图片的大小，但是注意，二者是等比例缩放
a标签
超链接
eg: 点我一下啊
href：填写的是跳转的地址
# id值，锚点，我们用不到，是一种效果，一般是前端来写
● 绝对URL - 指向另一个站点（比如 href=" http://www.jd.com ）
● 相对URL - 指当前站点中确切的路径（href="index.htm"）
target="_blank"--->跳转的时候新开一个tab页面
title="你看是什么"--->当鼠标悬浮的时候展示的内容
text-decoration 属性用来给文字添加特殊效果。
值 描述
none 默认。定义标准的文本。
underline 定义文本下的一条线。
overline 定义文本上的一条线。
line-through 定义穿过文本下的一条线。
inherit 继承父元素的text-decoration属性的值。
常用的为去掉a标签默认的自划线
列表
1. 无序列表(掌握)
- 第一个
- 第二个
- 第三个
type属性：
● disc（实心圆点，默认值）
● circle（空心圆圈）
● square（实心方块）
● none（无样式）
2. 有序列表(了解)
- 第一个
- 第二个
- 第三个
type属性：
● 1 数字列表，默认值
● A 大写字母
● a 小写字母
● Ⅰ大写罗马
● ⅰ小写罗马
3. 标题列表(了解)
- 标题1
- 内容1
- 标题2
- 内容1
- 内容2
表格
table
thead
tr----->代表一行
td(th)------>代表的是一列
tbody
tr----->代表一行
td------>代表的是一列
属性:
● border: 表格边框.
● cellpadding: 内边距
● cellspacing: 外边距.
● width: 像素 百分比.（最好通过css来设置长宽）
● rowspan: 单元格竖跨多少行
● colspan: 单元格横跨多少列（即合并单元格）
标签的两个重要属性
eg:
id:
# 一个html文档中，id只能有一个，并且不能重复，通过这个id可以唯一确定一个标签
class:
# 一个html文档中，class值是可以有多个的，可以重复
自定义属性
# 属性名可以自己来定，自定义属性一般用来存储数据的
form表单
form表单可以把用户输入的、选择的、上传的等都通过网络提交到后端
label通过id值绑定
eg:
input:
通过改变input的属性type来达到不同的输入类型
text 单行输入文本 <input type=text" />
password 密码输入框
date 日期输入框
checkbox 复选框
radio 单选框
submit 提交按钮
reset 重置按钮
button 普通按钮
hidden 隐藏输入框
file 文本选择框
属性说明:
● name：表单提交时的“键”，注意和id的区别
● value：表单提交时对应项的值
○ type="button", "reset", "submit"时，为按钮上显示的文本年内容
○ type="text","password","hidden"时，为输入框的初始值
○ type="checkbox", "radio", "file"，为输入相关联的值
● checked：radio和checkbox默认被选中的项
● readonly：text和password设置只读
● disabled：所有input均适用
每一个单选框、复选框标签都应该有一个属性叫name
# 把前端数据提交表单到后端
# 不能够提交表单，就是一个空白的按钮，事件
# 提交表单的功能，但是，必须写在form表单里,单独的button按钮无提交功能
属性说明：
● multiple：布尔属性，设置后为多选，否则默认单选
● disabled：禁用
● selected：默认选中该项
● value：定义提交时的选项值
验证form表单提交数据到后端
用的是flask框架做后端语言
代码不需要掌握，你只需要看下后端如何结合前端把数据提交到后端的
pip install flask # flask框架，Django框架
浙公网安备 33010602011771号