form表单

能够获取用户输入,选择,上传的信息和文件

并且将用户输入的内容全部发送给后端(比如和Django连用)

参数

action 控制数据提交的地址

三种书写方式

不写,默认就是朝当前页面所在的地址提交数据

写全路径(https:www.baidu.com)

只写路径后缀(/index/)

method 控制数据提交方式

post -----form表单默认是get请求

get

通常情况下input和label一起使用

<label for ='d1'>用户名:<input type ='text' id='d1'></label>

绑定id值 之后点击标签内任何的位置都可以自动选中input框内

form表单的type参数很多种 展示不同的功能

text 普通文本

password 输入的内容 会隐藏起来

date 日期

radis 单选圆圈

checkbox 复选框

hidden 隐藏

file 上传本地的文件

button 普通的按钮 可以绑定js事件

reset 重置按钮 清空内容

submit 提交按钮 能触发form表单提交数据的动作

设置性别的时候在gender前面加上name后只能选择一个性别,不加可以选择两个

select标签 下拉框

一个个的option标签就是一个个选项

默认单选 给他加上一个参数multiple 就可以变成多选

textarea 标签 可以设置长宽 书写长度比较大的数据

input标签可以加disable属性 禁用input标签框

input可以加value值 设置默认值

怎么默认选择 已经选中的标签

radio

checkbox

checked =‘checked’

当属性名和属性值相同的时候 可以只写属性名就可以了

能触动form表单的提交数据的两种标签

input标签type=submit

button标签

所有获取用户输入的标签 都应该有name属性

name属性类似于字典中的key

input框中获取的用户输入的value属性

针对选择框 传到后端的数据 必须有value属性决定

gorm表单如果提交文件数据 必须修改enctype = “multipart/form-data”

css

层叠样式表

用来控制html标签的样式的

css的语法结构

选择器 {属性1:属性值1}

css的三种引入方式

通过link标签引入外部的css文件,如果在同一个工作文件夹下可以通过点的方法,点出来<link rel="stylesheet" href="css小米样式.css">

直接在html页面上的head内通过style标签直接书写css代码

<style>
        #a{
            color: #3fff12;
        }
    </style>

行内(直接书写在标签内部通过style属性)

<h1 style="color: orange">我是Oscar</h1>

基本选择器

id选择器

类选择器

通用的选择器

元素选择器

组合选择器

div span

div>span

div+span

div~span

属性选择器

任何标签自带id和class属性

支持自定义属性 携带一些额外的数据

伪类选择器

a标签有四种状态

没有被点击过的状态

鼠标悬浮上的状态

点击上不松手的状态

点击之后 再回到原来的页面的状态

input框点击进去之后 的状态就是input获取焦点的状态 聚焦 focus

鼠标移去就是 释放焦点

在设置input框内的背景颜色时 只写color设置的时光标的颜色

伪元素选择器(清楚浮动带来的负面影响)

可以通过css添加文本内容

选择器的优先级

选择器相同的情况下 引入方式不同

遵循就近原则 哪个标签离body近

选择器不同的情况下

行内选择器 >id选择器>类选择器>元素选择器

分组与嵌套

同级下查找设置#d1,.c1,p{color:red};