知识回顾：

1）HTML 5.0（h5）比之前版本强大很多，增加很多新的标签

增强功能动画（flash内存占用泄漏，苹果ipad），
统一移动端开发（ios、安卓）重复性劳动，软件公司两支团队

2）CSS 3.0 和H5配合，增强整个网页这种表现能力

Electron 把网页变成桌面应用程序，word，excel，暴风影音
目前还不够成熟

3）很多标签，前端知识对于后端的工程师来说10%，写出来，页面展现出来

大概常用的记忆

4）样式，看个眼熟，了解意思：font-size，font-weight

可视化

5）动画非常丰富，

position: relative;
定位：动画一般情况下相当定位

6）对后端开发者，和前端技术配合

从后台连接数据库（mysql）查询数据库表中数据 student
（java jdbc）
把数据查询出来之后，把它展现在页面上（h5+css3）

表单 form
html对开发者而言

1）div,span,ul,li 数据展现（静态网站）

2）form，input（text/radio/checkbox/button），select

用户填写自己的信息，可以交互，可以不同用户区分
（动态网站）提交用户信息到后台 springmvc+spring+mybatis

label 展示名称

最早只有html
html+css
css封装，bootstrap

bootstrap3（暂时不使用4，3现在是市场主流，4和3不兼容的）
bootstrap3就是一堆样式定义，事先定义很多漂亮的风格
怎么使用呢？按这些案例分析，改造我们现有页面

1）加一个标签，代表表单

2）div大多增加一个样式修饰

<div class="form-group"> 大多文本框div修饰<label for="name">名称</label><input type="text" class="form-control" id="name" placeholder="请输入名称"></div>

3）check的div修饰

<div class="checkbox">

4）按钮样式也不同

<button class="btn btn-default"

小结：要使用bootstrap它必须改造页面上元素，增加很多class样式修饰

怎么引入bootstrap，它叫做一个样式表文件

从外部引入一个样式表文件样式表文件其实就是把页面上的

样式：
1）直接在元素上来加style属性

<h1 style="color:red;">学生信息管理系统</h1>

2）在页面上标签中声明

<style>body{width: 400px;margin: 30px;}</style>

3）link标签，多个html共享

<link rel="stylesheet" href="css/bootstrap.min.css">

bootstrap.min.css 只要.min，压缩文件，把所有内容放在一行上
压缩是格式，空格，换行，缩进tab（下载快）
bootstrap.css 正常文件（方便开发者看）

前端技术: H5表单CSS优化相关推荐

Java云同桌学习系列（十三）——前端技术之HTML与CSS
本博客java云同桌学习系列,旨在记录本人学习java的过程,并与大家分享,对于想学习java的同学,可以跟随我的步伐一起学习,我希望这个系列能够鼓励大家一同与我学习java,成为"云同桌& ...
获取form表单_【第1535期】前端 Form 的表单的一个通用解决方案
前言今日早读文章由阿里@布达投稿分享. @布达,Alibaba Fusion项目组的.花名潕量.主要专注在设计系统.组件.可视化搭建这个领域正文从这开始-- Fusion Next - Form ...
selenium定位H5表单验证的提示语
selenium定位H5表单验证的提示语前端代码,1.html <!DOCTYPE html> <html lang="en"> <head> ...
h5 php表单验证,H5表单验证失败该怎样提示
这次给大家带来H5表单验证失败该怎样提示,怎么用H5表单验证失败的提示?H5表单验证失败提示的注意事项有哪些,下面就是实战案例,一起来看一下. 我们知道,前端的童鞋在写页面时, 都不可避免的总会踩到 ...
H5表单验证2(h5自带验证美化)
h5自带验证美化:要做出不一样的表单验证,我们要了解一些伪类及css选择器. :required和:optional :in-range和:out-of-range :valid和:invalid : ...
前端：简述表单提交前如何进行数据验证
前端:简述表单提交前如何进行数据验证通常在提交表单数据时,我们会对数据进行验证,例如某些字段是必填字段,不能为空,这时应该如何做呢?有如下三种方法: 一.在button的submit事件进行判断 & ...
学习前端——表格、表单
学习前端--表格.表单表格在日常生活中使用的非常的多,比好excel就是专门用来创建表格的工具, 表格就是用来表示一些格式化的数据的,比如:课程表.银行对账单在网页中也可以来创建出不同的表格. ...
【前端基础】表单标签/提交
[前端基础]表单标签/提交表单标签 1. 表单的介绍 2. 表单相关标签的使用 3. 小结表单提交 1. 表单属性设置 2. 表单元素属性设置 3. 示例代码小结表单标签学习目标能够知道表 ...
魔众积分商城系统 v1.4.0 表单提交优化，系统监控升级
魔众积分商城系统提供积分商城,会员积分系统,积分兑换商城,积分系统,积分运营,营销活动工具,积分游戏.API接口对接会员积分系统,简单配置页面即可上线,助力企业会员运营管理. 魔众积分商城系统发布v1 ...

前端技术: H5表单CSS优化