changcumt/denew

denew's Issues

The information of HTML metas

meta是html语言head区的一个辅助性标签。meta标签的作用有：搜索引擎优化（SEO），定义页面使用语言，自动刷新并指向新的页面，实现网页转换时的动态效果，控制页面缓冲，网页定级评价，控制网页显示的窗口等！

meta标签的组成：meta标签共有两个属性，它们分别是http-equiv属性和name属性，不同的属性又有不同的参数值，这些不同的参数值就实现了不同的网页功能。

name 属性

<meta name="参数"content="具体的参数值">

A Keywords 关键词

SEO优化

<meta name="keywords"content="meta总结,html meta,meta属性,meta跳转"> 

B description 网站内容描述

SEO

<meta name="description" content="this is the description of this site" >

C robots 机器人向导

SEO

<mata name="robots" content="all" >

可选值有：
信息参数为all：文件将被检索，且页面上的链接可以被查询；
信息参数为none：文件将不被检索，且页面上的链接不可以被查询；
信息参数为index：文件将被检索；
信息参数为follow：页面上的链接可以被查询；
信息参数为noindex：文件将不被检索，但页面上的链接可以被查询；
信息参数为nofollow：文件将被检索，但页面上的链接不可以被查询

D author 作者

SEO

<meta name="author" content="Kylin">

E generator 生成器，该网站由什么软件开发

SEO

<meta name="generator" content="vscode">

F copyright 版权信息

SEO

<meta name="copyright" content="aaa">

G revisit-after 重访时间

<meta name="revisit-after" content="7days">

H application-name 软件名称

SEO

<meta name="application-name" content="my-app">

I viewport

视图显示 只针对移动端有效果

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no"

设置宽度为设备实际像素宽度，不允许放大缩小视图。一般移动端均有此设置。在移动端设置为device-width 比不设置会有性能提高。

2 http-equiv

meta http-equiv= "参数" content="参数变量值">； 

A expires 设置过期时间

<meta http-equiv= "expires" content="Fri,12Jan200118:18:18GMT">

必须是GMT时间

B Pragma catch模式(兼容老版本http，新版本使用catch-control)

<meta http-equiv= "Pragma" content="no-catch">

C Refresh 自动刷新

<meta http-equiv= "refresh" content="4,URL=http://www.baidu.com">

4秒钟后跳转到站外

D Window-target 当前页面以独立页面显示 禁止被frame

<meta http-equiv="Window-target"content="_top"> 

E catch-control

Public指示响应可被任何缓存区缓存
Private指示对于单个用户的整个或部分响应消息，不能被共享缓存处理。这允许服务器仅仅描述当用户的部分响应消息，此响应消息对于其他用户的请求无效
no-cache指示请求或响应消息不能缓存
no-store用于防止重要的信息被无意的发布。在请求消息中发送将使得请求和响应消息都不使用缓存。
max-age指示客户机可以接收生存期不大于指定时间（以秒为单位）的响应
min-fresh指示客户机可以接收响应时间小于当前时间加上指定时间的响应
max-stale指示客户机可以接收超出超时期间的响应消息。如果指定max-stale消息的值，那么客户机可以接收超出超时期指定值之内的响应消息。

阅读文档

2017-12-21
1 手把手带你走进下一代的ES6模块打包工具—Rollup https://segmentfault.com/a/1190000012515648
2 很全很全的JavaScript的模块讲解 https://segmentfault.com/a/1190000012464333?_ea=3022967
3 网站性能优化——DNS预热与合并HTTP请求 https://segmentfault.com/a/1190000012496298

常用CSS3代码片段

1 ios 滚动流程

-webkit-overflow-scrolling:touch

2 设置多行文本超过省略号

overflow: hidden;
text-overflow: ellipsis;
display:-webkit-box;
-webkit-line-clamp:2;
-webkit-box-orient:vertical;

3 禁止拖拽图片

 -webkit-user-drag: none;

4 取消input a 等高亮

-webkit-tap-highlight-color:transparent

5 禁止长按选中文字

  -webkit-touch-callout:none;
  -webkit-user-select:none;
  -khtml-user-select:none;
  -moz-user-select:none;
  -ms-user-select:none;
  user-select:none;

6 设置选中文本样式

E::selection { sRules }