<?xml version="1.0" encoding="utf-8" ?><rss version="2.0"><channel><title><![CDATA[橙子好的博客]]></title><description><![CDATA[人生需要无数修行，为了更少的错过]]></description><link>https://blog.youkuaiyun.com/hau5yi</link><language>zh-cn</language><generator>https://blog.youkuaiyun.com/</generator><copyright><![CDATA[Copyright &copy; hau5yi]]></copyright><item><title><![CDATA[使用Vue-cli下载一个以webpack打包的vue模板]]></title><link>https://blog.youkuaiyun.com/hau5yi/article/details/73824562</link><guid>https://blog.youkuaiyun.com/hau5yi/article/details/73824562</guid><author>hau5yi</author><pubDate>Tue, 27 Jun 2017 22:45:32 +0800</pubDate><description><![CDATA[如今vue.js热度不减，利用vue-cli和webpack可以非常便捷的搭建一个开发环境，以下列出利用vue-cli搭建一个vue.js模板的过程：1：安装vue-cli 
安装vue-cli前系统必须先装有node.js，我们将通过npm来进行环境搭建和依赖加载；本文将介绍window开发环境下的操作，mac系统下大同小异，在操作时需要加入权限sudo即可。 
    打开cmd，输入node]]></description><category></category></item><item><title><![CDATA[Sublime的Vue高亮插件安装方法]]></title><link>https://blog.youkuaiyun.com/hau5yi/article/details/73801245</link><guid>https://blog.youkuaiyun.com/hau5yi/article/details/73801245</guid><author>hau5yi</author><pubDate>Tue, 27 Jun 2017 16:26:31 +0800</pubDate><description><![CDATA[1：打开插件github地址： https://github.com/vuejs/vue-syntax-highlight； 
 
2：download其zip文件到本地。 
3：打开sublime点击首选项（“Preferences -> Browse Packages…”） 
4：在当前路径下创建Vue文件夹，并且将刚刚下载的vue高亮插件所有文件粘贴进来 
 
5：在sublime按下ctrl]]></description><category></category></item><item><title><![CDATA[CSS3中弹性盒子Flex使用]]></title><link>https://blog.youkuaiyun.com/hau5yi/article/details/64977159</link><guid>https://blog.youkuaiyun.com/hau5yi/article/details/64977159</guid><author>hau5yi</author><pubDate>Wed, 22 Mar 2017 22:02:48 +0800</pubDate><description><![CDATA[在介绍flex之前，先说一个面试时关于CSS布局常提到的问题，也就是三栏布局，左右两边固定，中间一栏自适应屏幕大小，如下效果： 
 
以前常见的做法就是将左右两边绝对定位，定位到相应的位置，中间设置width：100%；然后在设置对应的padding-left和padding-right值。现在CSS3中提供了flex属性，也就是弹性盒子布局，这样就很好地处理上面的问题，具体代码如下：<!DOCTY]]></description><category></category></item><item><title><![CDATA[利用padding百分比继承父级元素宽度特性实现元素宽高比例缩放]]></title><link>https://blog.youkuaiyun.com/hau5yi/article/details/60469225</link><guid>https://blog.youkuaiyun.com/hau5yi/article/details/60469225</guid><author>hau5yi</author><pubDate>Sun, 05 Mar 2017 17:20:56 +0800</pubDate><description><![CDATA[纯 CSS 实现高度与宽度成比例的效果 
最近在做一个产品列表页面，布局如下图所示。页面中有若干个 item，其中每个 item 都向左浮动，并包含在自适应浏览器窗口宽度的父元素中。  
item 元素的 CSS 定义如下： 
.item {
  float: left;
  margin: 10px 2%;
  width: 21%;
}这时遇到的一个需求：在保持 item 元素宽高比恒定（如高是]]></description><category></category></item><item><title><![CDATA[说说JSON和JSONP，原来ajax引用这个来实现跨域访问的]]></title><link>https://blog.youkuaiyun.com/hau5yi/article/details/60468901</link><guid>https://blog.youkuaiyun.com/hau5yi/article/details/60468901</guid><author>hau5yi</author><pubDate>Sun, 05 Mar 2017 17:03:42 +0800</pubDate><description><![CDATA[前言：由于Sencha Touch 2这种开发模式的特性，基本决定了它原生的数据交互行为几乎只能通过AJAX来实现。 
当然了，通过调用强大的PhoneGap插件然后打包，你可以实现100%的Socket通讯和本地数据库功能，又或者通过HTML5的WebSocket也可以实现与服务器的通讯和服务端推功能，但这两种方式都有其局限性，前者需要PhoneGap支持，后者要求用户设备必须支持WebSocke]]></description><category></category></item><item><title><![CDATA[BOM-不同浏览器对窗口尺寸的获取和修改]]></title><link>https://blog.youkuaiyun.com/hau5yi/article/details/53906662</link><guid>https://blog.youkuaiyun.com/hau5yi/article/details/53906662</guid><author>hau5yi</author><pubDate>Wed, 28 Dec 2016 11:02:06 +0800</pubDate><description><![CDATA[窗口的位置和大小用来确定和修改 window 对象位置的属性和方法有很多。IE、Safari、Opera 和 Chrome 
都提供了 screenLeft 和 screenTop 属性，分别用于表示窗口相对于屏幕左边和上边的位置 。 
Firefox 则在 screenX 和 screenY 属性中提供相同的窗口位置信息，Safari 和 Chrome 也同时 
支持这两个属性。 
//确定窗口的]]></description><category></category></item><item><title><![CDATA[CSS文档流和非文档流下的宽度和高度问题总结]]></title><link>https://blog.youkuaiyun.com/hau5yi/article/details/53858013</link><guid>https://blog.youkuaiyun.com/hau5yi/article/details/53858013</guid><author>hau5yi</author><pubDate>Sat, 24 Dec 2016 12:25:24 +0800</pubDate><description><![CDATA[1、元素不设宽度时 
a)第一种情况：元素为标准文档流元素时 
i.子元素为默认情况下时 
1.父元素设定宽度时，继承父元素的宽度； 
代码如下： 
 
效果如下： 
 
2.父元素不设定宽度时，继承body的宽度； 
代码如下： 
 
效果如下： 
 
ii.子元素为相对定位时 
1.父元素设定宽度时，继承父元素的宽度； 
代码如下： 
 
效果如下： 
 
2.父元素不设定宽度时，继承body的]]></description><category></category></item><item><title><![CDATA[photoshop常用快捷键（画作图标）]]></title><link>https://blog.youkuaiyun.com/hau5yi/article/details/53857777</link><guid>https://blog.youkuaiyun.com/hau5yi/article/details/53857777</guid><author>hau5yi</author><pubDate>Sat, 24 Dec 2016 11:57:40 +0800</pubDate><description><![CDATA[Photoshop常用快捷键 
退出软件：ctrl+q 
界面颜色：ctrl+f1加深颜色  ctrl+f2减淡颜色 
切换ps界面形式：tab 
多个ps文件切换：ctrl+tab 
视图模式切换：F，三种 
平移：h抓手工具 
旋转：R 
缩放：Z+点击，alt+鼠标滚轮 
首选项对话框：ctrl+shift+k 
自定义快捷键：ctrl+shift+alt+k 
恢复默认设置：启动时同时按下c]]></description><category></category></item><item><title><![CDATA[IE下的圆角解决方案]]></title><link>https://blog.youkuaiyun.com/hau5yi/article/details/53857286</link><guid>https://blog.youkuaiyun.com/hau5yi/article/details/53857286</guid><author>hau5yi</author><pubDate>Sat, 24 Dec 2016 11:10:12 +0800</pubDate><description><![CDATA[当今网页设计里涉及到圆角的地方是非常多的，所以这也催生了CSS3里面的border-radius属性，但是让人头疼的IE8以及以下版本并不支持这一属性。以下是w3c手册里对该属性兼容性的解释：IE9+、Firefox 4+、Chrome、Safari 5+ 以及 Opera 支持 border-radius 属性。 
那么有没有什么在IE9-以下实现圆角呢？很多人都会想到点九切图平铺，这显然是一种方]]></description><category></category></item><item><title><![CDATA[巧用边框：使用三个div画出一个八卦图形]]></title><link>https://blog.youkuaiyun.com/hau5yi/article/details/53845020</link><guid>https://blog.youkuaiyun.com/hau5yi/article/details/53845020</guid><author>hau5yi</author><pubDate>Fri, 23 Dec 2016 23:19:33 +0800</pubDate><description><![CDATA[话不多说，先上图分析结构 
 
按照正常的思路，在观看这个图形的时候，我们会想到这个图形是按照五个结构来通过颜色设置和形状设定以及定位进行安装的。 
这个，我们其实只要使用三个div就可以画出这个八卦图形 
首先创建三个div标签：<div id="box">
            <div class="one"></div>
            <div class="two"></div]]></description><category></category></item></channel></rss>