工作中遇见的一些问题总结

2017-08-07

学习fis3语法.

  • 命令:
    • -d destination 构建发布到的目标文件
    • -r run 运行
    • -w watch 监视
  • 配置文件:
    • fis.match(selector, props) 匹配文件路径,设置编译规则属性
    • fis.media() 接口提供多种状态功能(开发环境、生产环境、scss)
  • 插件(parser):
    • fis-parser-node-sass sass/scss 编译成 css
    • fis-parser-babel-5.x jsx/es6/es7编译成es5
    • fis3-parser-typescript typescript/es6/jsx 编译成 js。速度相比babel略快,但是 es7 跟进较慢
    • fis-parser-less-2.x less 编译成 css
  • 压缩(optimizer):
    • fis.plugin(‘uglify-js’) 压缩js
    • fis.plugin(‘clean-css’) 压缩css
    • fis.plugin(‘png-compressor’) 压缩图片
    • fis.plugin(‘html-strip’) 压缩html

2017-08-08

问题:弹性布局中flex-grow属性的作用
解决:查看资料了解了flex-grow和flex-shrink的区别
flex-grow 属性决定了父元素在空间分配方向上还有剩余空间时,如何分配这些剩余空间。其值为一个权重(也称扩张因子),默认为 0(纯数值,无单位),剩余空间将会按照这个权重来分配。
flex-shrink 属性定义空间不够时各个元素如何收缩。其值默认为 1。

2017-08-16

  1. 问题:谷歌浏览器不识别12px以下的字体大小(10px)
    解决:(1)设置-webkit-transform:scale(0.83),按比例缩小字体。但是标签左右会因缩小产生空白间隙,导致无法向左或者向右对齐(使用transform:scale(0.83)时; 不仅是文字变小了,整个文字所在的容器也同时会变小);
    (2)-webkit-text-size-adjust:none;(取消浏览器最小字体限制),但是只对英文才有效,对中文无效。在新版的chrome中,已经禁止了改属性,只对chrome27.0 版本以下有效,27.0以上版本无效。
    设置字体大小为10px,在浏览器模拟器上无法识别,但在真机上不会出现问题。
    1. 问题:父盒子使用 display:-webkit-box; 布局,子盒子使用 -webkit-box-flex: 1; 等比例分栏,当给其中一个子盒子设置padding或者margin时,会改变子盒子的盒模型大小。
      解决:根据情况按等比例使子盒子分栏。例如:分两栏,则给两个子盒子分别设置:width:50%; 在这种情况下不会改变子盒子的盒模型大小。

2017-08-21

问题:iPhone5下的“投资明细”页面左栏圆圈tag变形。
解决:主要是由于给圆圈设置的border宽度为rem单位,因此导致想屏幕下的border自适应屏幕之后变得特别小,然后变形。使用px为单位就可以解决问题了。在以后的开发中,类似于border宽度的,都应该使用px固定单位,而不用rem作为单位。

2017-08-28

熟悉状态码304:重定向,资源有缓存
自从上次请求后,请求的网页未修改过。服务器返回此响应时,不会返回网页内容。
如果网页自请求者上次请求后再也没有更改过,您应将服务器配置为返回此响应(称为 If-Modified-Since HTTP 标头)。服务器可以告诉 Googlebot 自从上次抓取后网页没有变更,进而节省带宽和开销。

2017-08-30

2 . 了解document.referrer的兼容性,以及失效的几种情况
* http://www.zhangxinxu.com/wordpress/2017/02/js-page-url-document-referrer/
* http://blog.csdn.net/flyingpig2016/article/details/53130912

3 . 了解CSRF跨站请求伪造攻击和ClickJacking漏洞
* CSRF跨站请求伪造攻击:
+ http://www.cnblogs.com/hyddd/archive/2009/04/09/1432744.html
+ http://blog.csdn.net/stpeace/article/details/53512283
* ClickJacking漏洞:
+ https://www.zhuyingda.com/blog/article.html?id=6&origin=cnode

4 . 了解location对象的一些属性和方法
* 属性:
+ hash 设置或返回从井号 (#) 开始的 URL(锚)。
+ host 设置或返回主机名和当前 URL 的端口号。
+ hostname 设置或返回当前 URL 的主机名。
+ href 设置或返回完整的 URL。
+ pathname 设置或返回当前 URL 的路径部分。
+ port 设置或返回当前 URL 的端口号。
+ protocol 设置或返回当前 URL 的协议。
+ search 设置或返回从问号 (?) 开始的 URL(查询部分)。
* 方法:
+ assign() 加载新的文档。
+ reload() 重新加载当前文档。
+ replace() 用新的文档替换当前文档。

你可能感兴趣的:(工作分享)