form表单和CSS基础
form 表单
input type="" 表单的组合标签,用来确定需要的是什么输入类型
type属性值:
文本输入框:text
密码输入框:password
单选按钮:radio
A:要单选按钮实现互斥,必须设置相同的name值
B:默认提交的是on值,一般会指定value值来区分,和复选框一样
复选框:checkbox
A:要指定value值,单选或者复选框中,后面的文本信息和标签没有联系,提交的是value的值
B: name相同,服务器处理复选框时,会把值存入数组
提交按钮:submit
重置按钮:reset
隐式文本:hidden(常用来储存储id值)
下拉列表:select 表单的组合标签·
option: select的子标签,用来确定列表中文本 selected默认选中
文本域:textarea
属性:rows cols 设置行与列
注意:其它组件都有value属性,但是textarea没有,提交的值只能设置在标签体中
CSS语法
A:直接在标签中运用
<font style="color:green;font-size:200px;">宝宝</font>
B:在本页面中引用,位置放在head中
<style> //样式
font(这里可以是一个任意的选择器){
属性:属性值;
属性:属性值;
选择器可以是标签,可以是类名class="值" .值{}
可以是id id="值" #值{}
}
div{
/*
* 这是一个块级元素,默认占满当前行
* display:inline 设置行位置
* border:1px solid red; 盒子的颜色和粗细
* height width 盒子大小
* margin-left 盒子与盒子之间的位置关系
* padding-top 内容与盒子之间的关系
* float:left 将div分为空间上的两种格局
* clear:both 取消div的浮动
*/
}
span{
/*
* 这是一个行内元素,默认刚好包裹当前内容
*/
}
</style>
C:将CSS的内容单独封装,引用
<link rel="stylesheet" href="../../css/my.css" type="text/css"/>
form表单和CSS基础的更多相关文章
- 前端-form表单与CSS
目录 form表单 表单属性 label标签 input标签 select 下拉框标签 textarea多行文本 提交 Flask 结合form表单 初探 CSS介绍以及基本选择器 基本选择器 组合选 ...
- 1113 form表单与css选择器
目录 1.form表单 form元素 特点 参数 form元素内的控件 1.input的使用 2.select标签 3.textarea元素 4.autofocus属性 2.CSS 1.基础语法 cs ...
- (day43)form表单、css
目录 昨日回顾 一.HTTP协议 (一)四大特性 (二)数据格式 (1)请求格式 (2)响应格式 (三)响应状态码 二.HTML (一)什么是HTML (二)注释 (三)文档结构 (四)head内标签 ...
- 前端form表单与css
form表单(******) 能够获取用户输入(输入,选择,上传的文件) 并且将用户输入的内容全部发送给后端 参数 action 控制数据提交的地址 三种书写方式 1.不写 默认就是朝当前这个页面所在 ...
- form表单和CSS
一.form表单 1. form表单有什么用 能够获取用户输入的信息(输入,选择, 上传的文件),并且将这些数据全部发送给后端 2. form表单的用法 (1)有两个重要参数: action : 控制 ...
- 前端之form表单与css(1)
目录 一.form表单 1.1表单的属性 1.2input 1.2.1form表单提交数据的两种方式 1.3select标签 1.4label标签 1.5textarea多行文本标签 二.CSS 2. ...
- form表单与CSS选择器和样式操作
form表单 """获取前端用户数据并发送给后端服务器""" <form action=""></fo ...
- form表单,css简介,css选择器,css样式操作
form表单 简介 表单在Web网页中用以让访问者输入数据,当提交表单时,表单中输入的数据被打包传递给Web服务器端的程序 以处理,从而使得Web服务器与用户之间具有交互功能. 表单实现前后台交互:用 ...
- form表单与css选择器
目录 form表单 action属性 input标签 lable标签 select标签 textarea标签 补充 网络请求方式 CSS简介 CSS基本选择器 组合选择器 属性选择器 分组与嵌套 伪类 ...
随机推荐
- [转载]真正的inotify+rsync实时同步 彻底告别同步慢
原文链接http://www.ttlsa.com/web/let-infotify-rsync-fast/ 背景我们公司在用inotify+rsync做实时同步,来解决分布式集群文件一致性的问题.但当 ...
- 什么是AngularJs?特点是什么?和JQuery什么区别和联系
什么是AngularJs? AngularJs是js框架,集中操作数据,不关注Dom操作,适用于以数据操作为主的的SPA(单页应用). 它的特点 采用MVC模型 双向数据绑定 依赖注入 模块化 与jQ ...
- PAT_A1131#Subway Map
Source: PAT A1131 Subway Map (30 分) Description: In the big cities, the subway systems always look s ...
- Python数字类型及数学运算
1.数字类型分为int.float和complex,complex暂时用不到,int和float的相关运算和类型转换如下: >>> 59+12 71 >>> 59- ...
- JVM系列文章合集
博客作者:纯洁的微笑 JVM系列(①):java类的加载机制 JVM系列(②):JVM内存结构 JVM系列(③):GC算法 垃圾收集器 JVM系列(④):jvm调优-命令大全(jps jstat jm ...
- 关于char(M)和varchar(N)的区别
1.int(10)的10表示显示的数据的长度,不是存储数据的大小:chart(10)和varchar(10)的10表示存储数据的大小,即表示存储多少个字符. int(10) 10位的数据长度 9999 ...
- Spring学习笔记(4)——IoC学习
IoC理论的背景我们都知道,在采用面向对象方法设计的软件系统中,它的底层实现都是由N个对象组成的,所有的对象通过彼此的合作,最终实现系统的业务逻辑. 图1:软件系统中耦合的对象 如果我们打开机械式手表 ...
- 消费kafka的消息,并将其SparkStreaming结果保存到mysql
将数据保存到mysql,需要用到jdbc.为了提高保存速度,我写了一个连接池 1.保存到mysql的代码 package test05 import org.apache.log4j.{Level, ...
- 企业级NginxWeb服务优化实战(下)
企业级NginxWeb服务优化实战(下) 4. Nginx站点目录及文件URL访问控制 4.1 根据扩展名限制程序和文件访问 Web2.0时代,绝大多数网站都是以用户为中心多的,例如:bbs,blog ...
- 8、Python MySQL - mysql-connector 驱动
一. 在线安装 mysql-connector : pip install mysql-connector-python 二.操作流程 1.连接数据库信息: conn = mysql.connec ...