yivisir的博客

PRPL模式概念PRPL模式是一种让网页加载变得可交互、更快速的模式。Push或Preload：给用户推送最重要的资源；Render：尽快渲染最初始的路由，使网页有交互能力；Pre-cache：提前缓存剩余的资源；Lazy-load：懒加载其他的路由或者次要的资源。PreloadPreload是一个声明性质的fetch request，告诉浏览器尽快请求该资源。<link rel="preload" as="style" href="css/style.css">

HTML：SEO优化之旅一、何为SEOSEO（Search Engine Optimization），即搜索引擎优化；SEO是随着搜素引擎的出现而来的；他的存在是为了提升网页在搜索引擎自然搜索结果中的收录数量以及排序位置，是的用户在搜索网站时能排在前面；二、SEO能做什么大于网站的标题、关键字、描述进行设置，反映网站的定位，让搜索引擎明白该网站时干什么的；内容优化：内容与关键字的对应，增加关键字密度；在网站上合理设置Robot.txt文件；生成针对搜索引擎友好的网站地图；增加外部链

SVG：基础知识一、viewBox和preserveAspectRatio1. viewBoxsvg的viewBox是一个十分强大的属性，他允许svg画布无限延伸，并且精准控制其可视区域。总共有4个参数，按照x,y,width,height的顺序设置；viewBox的参数是不用单位的，原因是svg的可视空间不是通过像素来定义的，而是一个可以随意延申的空间，这样就可以适应不同的尺寸；我们可以理解为，svg画布会被分成一张网格，即使svg的宽高改变，里面方格的数量也不会改变，因此图形占画布的比例也不

HTML5:移动端开发入门一、前言常见的移动端开发分为移动版网站和响应式设计。移动端开发可以让技术人员专注于移动端的页面优化，而无需在意桌面版的兼容，但页面一旦改动内容，维护成本就翻倍了；响应式设计让开发人员只需维护一份项目，节省开发和维护成本，不过缺点是需要做好移动端和桌面端的兼容，也十分考验页面设计。两种开发方式孰强孰弱，暂无定论，本博客主要探讨一下移动端开发的技巧。二、移动端开发技巧1. Viewport设置传统桌面端网站的显示窗口往往都是在1024X768的分

SCSS:芜湖起飞~1. 变量使用1-1. 变量声明$my-color : yellow;类似于作用域，当变量定义在模块外时，其他模块都可以使用；而当定义在模块里时，就只能在模块中使用。1-2. 变量引用$my-color : yellow;$my-border : 1px solid $my-color;header { $my-width : 100px; color : $my-color; width : $my-width; border :

CSS中position属性的区别static即没有定位，遵循正常的文档流对象，会忽略top,left,bottom,right的作用； fixed相对于浏览器可视区固定位置；脱离文档流，不占据空间 relative相对于其正常位置定位；原本占据的空间不会移动；常用来作为绝对定位元素的容器； absolute相对于最近的已定位的父级元素，如果没有，则相对于html元素；脱离文档流，不占据空间 sticky基于用户的滚动位置来定位，在position和fixed之间