首页 > 其他 > 详细

前端 --- 基础 2

时间:2019-11-13 20:17:05      阅读:85      评论:0      收藏:0      [点我收藏+]

目录

form表单

能够获取用户输入(输入,选择,上传的文件)并将用户输入的内容全部发送给后端

form的参数

action:控制数据提交的地址

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

2.写全路径(https://www.baidu.com

3.只写路径后缀(/index/)

通常情况下input需要结合label一起使用

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

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

能够触发form表单提交数据的动作有两个标签

1.input标签 type=submit

2.button标签

与后端进行交互,所有获取用户输入的标签,都应该有name属性

1.name属性就类似于字典的key

2.input框获取到的用户输入都会放到input框的value属性中

3.针对选择框,传到后端的数据,由value属性决定

4.form表单如果要提交文件数据,必须在form中修改一下属性

enctype="multipart/form-data"

css

用来控制html标签样式的

注释:

注释
/*单行注释*/

/*多行注释1
多行注释2*/
css语法结构

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

css的三种引入方式

1.通过link标签引入外部的css文件(最正规)

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

<head>
    <meta charset="UTF-8">
    <title>伪类选择器测试</title>

    <h1>伪类选择器</h1>

    <style>

        input:focus{
            background-color: red}

    </style>

</head>

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

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

1.基本选择器

元素选择器

id选择器

类选择器

通用选择器

2.组合选择器

div span

div>span

div+span

div~span

3.属性选择器

任何标签都有自己的默认属性 id class

标签还支持你自定义任何多的属性(也就意味着可以让标签帮你携带一些额外的数据)

4.伪类选择器

a标签的四种状态

1.没有被点击过

2.鼠标悬浮上面

3.点击之后不松手

4.点击之后再回去

我们将input框鼠标点进去之后的呢个状态叫做input获取焦点,也称作聚焦 focus

鼠标一出去之后的状态叫做input框失去焦点

5.伪元素选择器

清楚浮动带来的负面影响

可以通过css添加文本内容

选择器的优先级

1.选择器相同的情况下,引入方式不同:遵循就近原则,谁离标签更近,就听谁的

2.选择器不同的情况下:行内选择器 > id选择器 > 类选择器 > 元素选择器

技术分享图片

前端 --- 基础 2

原文:https://www.cnblogs.com/whkzm/p/11852388.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!