响应式页面过程问题

1.atom目录树生成.DC_Store 文件，怎么处理？

atom 编辑器自带tree-view 这个package，而且显示出来的.DS_Store看着很烦，下面介绍隐藏的方法。

参考文章：  http://www.cnblogs.com/zhaowmm/p/6128883.html 

1.preference - > setting -> core 中，找到Ignored Names，在其中添加 .DS_Store，注意添加","

2.在packages中搜索"tree-view" 在其设置中，勾选 Hide Ignored Names

3.完成

2.Mac下怎么做到不同程序切换？

把程序都最大化，然后四指/三指滑动切换，或者ctr+方向键

3.div中块元素如何居中

4.a等行内元素如何设置高度宽度

可通过padding

5.box-shadow

http://www.w3school.com.cn/cssref/pr_box-shadow.asp

https://www.cnblogs.com/miaoxiaojiao/p/7077704.html

基本语法是{box-shadow:[inset] x-offset y-offset blur-radius spread-radiuscolor}

对象选择器 {box-shadow:[投影方式] X轴偏移量 Y轴偏移量阴影模糊半径 阴影扩展半径 阴影颜色}

6.代码折叠

cmd + option + [ 折叠鼠标所在代码段

cmd + option + ] 展开鼠标所在代码段

全选之后 cmd + k 然后 cmd + num（1， 2， 3， 4）可以选择折叠级别

7.css中设置hr 不显示颜色

CSS文件中设置hr属性，如下，不显示颜色，并且什么都没有了

hr {

border: none;

height: 5px;

color: red;

}

网上搜索，给默认的hr改成我们需要的颜色时，需要将它的高度设一个值，使用背景色，并将border设为none。但是我上面的代码也都有设置，仍然没用。

但是在HTML中定义样式就起作用……

<hr style=" height:2px;border:none;border-top:2px dotted red;" />

后来把hr 定义了class名称通过class定义，

<hr class="line">

.line {

border: none;

height: 5px;

background-color: red;

}

生效了……

应该是权重的问题，但是是哪个的权重高了呀……

还有一个问题，我把hr 作为后代选择器又不生效了……

.footer line {

border: none;

height: 5px;

background-color: red;

}这样就不生效了……

.footer hr {

border: none;

height: 5px;

background-color: red;

}有效果

原因？是不是后代选择器不能是两个class……还是权重的问题？

呵呵 我知道为什么了，真是个白痴……是后代选择器的格式错了呀大姐！

.footer . line {

border: none;

height: 5px;

background-color: red;

}

class 作为选择器 要加上 . 啊！

内联起作用了是因为权重的问题，内联style属性的权重是最高的，但是还是不能解决为什么CSS就不起作用呀？

8.段落首行缩进

我们要让每段文字开头缩进，并且可以控制缩进距离我使用text-indent缩进单词。如果不想使用text-indent样式进行缩进，我可以使用空格来实现，但需要多打几个 html空格字符 “ &nbsp; ”实现空格字符占位缩进

9. <meta http-equiv="X-UA-Compatible" content="ie=edge">什么意思？

1、X-UA-Compatible

X-UA-Compatible是自从IE8新加的一个设置，对于IE8以下的浏览器是不识别的。 通过在meta中设置X-UA-Compatible的值，可以指定网页的兼容性模式设置。

在网页中指定的模式优先权高于服务器中(通过HTTP Header)所指定的模式。 兼容性模式设置优先级：

meta tag > http header

meta tag > http header

常用的例子：

<meta http-equiv="X-UA-Compatible" content="IE=7"> #以上代码告诉IE浏览器，无论是否用DTD声明文档标准，IE8/9都会以IE7引擎来渲染页面。 <meta http-equiv="X-UA-Compatible" content="IE=8"> #以上代码告诉IE浏览器，IE8/9都会以IE8引擎来渲染页面。 <meta http-equiv="X-UA-Compatible" content="IE=edge"> #以上代码告诉IE浏览器，IE8/9及以后的版本都会以最高版本IE来渲染页面。 <meta http-equiv="X-UA-Compatible" content="IE=7,IE=9"> <meta http-equiv="X-UA-Compatible" content="IE=7,9"> <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">#以上代码IE=edge告诉IE使用最新的引擎渲染网页，chrome=1则可以激活Chrome Frame.

<meta http-equiv = "X-UA-Compatible" content = "IE=7" >    #以上代码告诉IE浏览器，无论是否用DTD声明文档标准，IE8/9都会以IE7引擎来渲染页面。   <meta http-equiv = "X-UA-Compatible" content = "IE=8" >    #以上代码告诉IE浏览器，IE8/9都会以IE8引擎来渲染页面。   <meta http-equiv = "X-UA-Compatible" content = "IE=edge" >    #以上代码告诉IE浏览器，IE8/9及以后的版本都会以最高版本IE来渲染页面。   <meta http-equiv = "X-UA-Compatible" content = "IE=7,IE=9" >    <meta http-equiv = "X-UA-Compatible" content = "IE=7,9" >    <meta http-equiv = "X-UA-Compatible" content = "IE=Edge,chrome=1" > # 以上代码IE = edge告诉IE使用最新的引擎渲染网页，chrome = 1则可以激活Chrome Frame .

2、 content = "IE=Edge,chrome=1" 

meta信息中常有这么一句：

<meta content="IE=edge,chrome=1" http-equiv="X-UA-Compatible">

这里的chrome=1不是说IE的技术增强了可以模拟Chrome浏览器，而是与谷歌开发的Google Chrome Frame(谷歌内嵌浏览器框架GCF)有关。这个插件可以让用户的IE浏览器外观不变，但用户在浏览网页时实际上使用的是Chrome的内核，并且支持Windows XP及以上系统的IE6/7/8。

而上文提到的那个meta标记，则是在是安装了GCF后，用来指定页面使用chrome内核来渲染。 

GCF下载地址: http://code.google.com/intl/zh-CN/chrome/chromeframe/ （ie打开）

安装完成后,如果你想对某个页面使用GCF进行渲染，只需要在该页面的地址前加上 gcf： 即可，例如： gcf:http://cooleep.com 

但是如果想要在开发时指定页面默认首先使用GCF进行渲染，如果未安装GCF再使用IE内核进行渲染，该如何进行呢? 

就是使用这个标记。