须要。
利用Jqury进行批量提交,或者(框架结合,验证组件去做表单验证,还有from的特性,记住用户的账号密码)

HTML5

php怎么应用css周全体系讲授CSS 工作运用 Docker

新区块标签sectionarticlenavaside表单增强日期、韶光、搜索表单验证Placeholder自动聚焦header/footer头尾section/article 区域nav导航aside 不主要内容em/strong 强调iicon

html分类

html嵌套

https://www.zhihu.com/question/34952563,如果看不懂我截图的大概意思,可以看一下顾轶灵前辈的回答,很清楚。

问题:doctype的意义是什么

让浏览器以标准模式渲染让浏览器知道元素的合法性

问题:HTML XHTML HTML5的关系

HTML属于SGMLXHTML属于XML,是HTML进行XML严格化的结果HTML5不属于SGML或XML,比XHTML宽松

问题:em和i有什么差异

em是语义化的标签,表强调i是纯样式的标签,表斜体HTML5中i不推举利用,一样平常用作图标

问题:语义化的意义是什么

开拓者随意马虎理解机器随意马虎理解构造(搜索、读屏软件)有助于SEOsemantic microdata

问题:哪些元素可以自闭合

表单元素input图片imgbr hrmeta link

问题:HTML和DOM的关系

HTML是“去世”的DOM由HTML解析而来,是活的JS可以掩护DOM

问题:property和attribute的差异

attribute是“去世”的property是“活”的

问题:form的浸染有哪些

直接提交表单利用submit/reset按钮便于浏览器保存表单第三方库可以整体提取值第三方库可以进行表单验证

Cascading Style Sheet(层叠样式表)

CSS解析从右向左解析(高效)优先级不能通过数量叠加超过比自己强大的优先级!important 优先级最高元素属性 优先级高相同权重 后写的生效

非布局样式

字体

字体族不须要引号字体族serif sans-serif monospace cursive fantasy多字体fallback网络字体、自定义字体iconfont

行高

line-heightvertical-align 基线 图片缝隙问题

背景

颜色渐变 linear-gradient多背景叠加雪碧图base64 和性能优化用来少量图标上css文件增大,图片体积增加三分之一,不过减少HTTP要求数分辨率适配

边框(略)

滚动

文本折行

overflow-wrap(word-wrap)通用换行掌握是否保留单词word-break 针对多字节笔墨中文句子也是单词white-space 空缺处是否断行

装饰属性

字重(粗体)font-weight斜体 font-style:itatic下划线text-decoration指针 cursor

布局

absolute因此最近父级absolute或者relative来定位的,如果没有就以body定位z-index适用于absolute和relative属性table表格布局float浮动 + margin分开文档流,不分开文本流BFC只管即便靠上左(右)小心父级高度塌陷overflow:auto打消浮动inline-block 布局自适应比较繁琐须要处理间隙代码间空缺导致font-size:0flexbox布局弹性盒子盒子本来便是并列的指定宽度即可相应式在不同设备上正常利用一样平常紧张处理屏幕大小问题紧张方法:隐蔽+折行+自适应空间rem/viewport/media query

效果

box-shadowtext-shadowborder-radiusbackgroundclip-path保持原来的大小支持动画

问题

如何用一个div画XXXbox-shadow无限投影::before::after如何产生不占空间的边框box-shadowoutline如何实现iOS图标的圆角

动画

视觉暂留补间动画transition位置-平移(left/right/margin/transform)方位-旋转(transform)大小-缩放(transform)透明度(opacity)其它-线性变换(transform)关键帧动画keyframes逐帧动画适用无法补间打算的动画资源较大animation-timing-function利用steps()去掉补间

过渡动画和关键帧动画的差异

过渡动画须要有状态变革关键帧动画不须要状态变革关键帧动画能掌握更风雅

CSS动画的性能

1.性能不坏2.部分情形下优于JS3.但JS可以做到更好4.部分高危属性box-shadow等

CSS预处理器

嵌套反响层级和约束变量和打算减少重复代码Extend和Mixin代码片段循环适用于繁芜有规律的样式import CSS文件模块化

Bootstrap

BootstrapJS利用办法基于data- 属性基于JS API定制方法利用CSS同名类覆盖修正源码重新构建引用scss源文件 修正变量Bootstrap的优缺陷优点:CSS代码构造合理现成的样式可以直接用缺陷:定制较为繁琐体历年夜Bootstrap如何实现相应式布局事理:通过media query设置不同分辨率的class利用:为不同分辨率选择不同的网格class

css工程化

PostCSS插件import 模块合并autoprefixier 自动加前缀cssnano 压缩代码cssnext 利用CSS新特性

precss 变量,mixin,循环等

webpack

css-loader 将CSS变成JSstyle-loader 将JS样式插入headExtractTextPlugin 将CSS从JS中提取出来css modules办理CSS命名冲突的问题less-loader sass-loader 各种预处理器postcss-loader PostCSS处理

如何办理CSS模块化问题

Less Sass等CSS预处理器PostCSS插件(postcss-import/precss等)webpack处理CSS(css-loader+style-loader)

PostCSS可以做什么?

取决于插件可以做什么autoprefixer cssnext precss等兼容性处理import模块合并css语法检讨兼容性检讨压缩文件

CSS modules是做什么的,如何利用

办理类名冲突的问题利用PostCSS或者webpack等构建工具进行编译在HTML模板中利用编译过程产生的类名

Angular

ShadowDOM逻辑上一个DOM构造上存在子集构造Scoped CSS限定了范围CSS无法影响外部元素外部样式一样平常不影响内部可以通过 /deep/ 或 >>> 穿透仿照Scoped CSS方案一:随机选择器(不支持)方案二:随机属性<div abcdefg>div[abcdefg]{}

Vue

仿照Scoped CSS方案一:随机选择器css modules方案二:随机属性<div abcdefg>div[abcdefg]{}

React

官方没有集成方案社区方案浩瀚css modules(babel)react-css-modulesstyled componentsstyled jsxnpm run eject 开释底层配置styled-components

作者:侠客岛的含笑

链接:https://www.imooc.com/article/266772