任务6深度思考

1.去除inline-block间距有哪几种方法？ 

1、inline-block到底是什么？关于inline-block在display里的英文解释：This value causes anelement to generate an inline-level block container. The inside of aninline-block is formatted as a block box, and the element itself isformatted as an atomic inline-level box.大致意思就是：inline-block 后的元素创建了一个行级的块容器，该元素内部（内容）被格式化成一个块元素，同时元素本身则被格式化成一个行内元素。一句话解释：它是一个格式化为行内元素的块容器。兼具行内元素和块元素的特点。2、inline-block为什么会有间距？归根结底这是一个西文排版的问题。举一个很简单的例子：I am very happy南京市长江大桥欢迎您英文有空格作为词分界，而中文则没有。（这背后延伸出一个中文分词的问题）这个问题的原因可以上述到SGML(标准通用标记语言)和TeX(排版工具)，它实际上是一个行内（inline）的问题，它由空格、换行或回车所产生空白符所致二.知识剖析既然知道问题产生的原因，解决方法就由此得出。1、改变代码书写方式。2、改变字符大小。3、改变元素间距。

方法1: 改变书写方式方法2：font-size方法3：使用margin负值方法4：使用word-spacing或letter-spacing这些方法在网上能查到很详细的说明，我就简略记录一下。方法1:改变书写方式元素间留白间距出现的原因就是标签段之间的空格，因此，去掉HTML中的空格，自然间距就消失了。

我们可以把inline-block元素写在同一行，这种方案是最直接的解决方案，但却也是最不靠谱的方案，存在很多不可控因素。 很多场景会让你崩溃：前后端协同；版本更迭；他人接手；自己忘了...，太多一不小心都可能让这个方案失效。考虑到代码可读性，显然连成一行的写法是不可取的，我们可以进行改进，还有下面非人类的写法：

方法2：font-size这个方法，基本上可以解决大部分浏览器下inline-block元素之间的间距。

方法3：使用margin负值margin负值的大小与上下文的字体和文字大小相关，Arial字体的margin负值为-3像素，Tahoma和Verdana就是-4像素，而Geneva为-6像素。由于外部环境的不确定性，以及最后一个元素多出的父margin值等问题，这个方法不适合大规模使用。

方法4：使用word-spacing或letter-spacing一个是字符间距(letter-spacing)一个是单词间距(word-spacing)，大同小异。letter-spacing子元素要设置letter-spacing为0，不然会继承父元素的值；使用word-spacing时，只需设置父元素word-spacing为合适值即可。使用letter-spacing和word-spacing时，其在不同浏览器下效果不同。

2.css有哪些属性可以继承？

不可继承的：display、margin、border、padding、background、height、min-height、max- height、width、min-width、max-width、overflow、position、left、right、top、 bottom、z-index、float、clear、table-layout、vertical-align、page-break-after、 page-bread-before和unicode-bidi

所有元素可继承：visibility和cursor

内联元素可继承：letter-spacing、word-spacing、white-space、line-height、color、font、 font-family、font-size、font-style、font-variant、font-weight、text- decoration、text-transform、direction

块状元素可继承：text-indent和text-align

列表元素可继承：list-style、list-style-type、list-style-position、list-style-image

表格元素可继承：border-collapse

1、字体系列属性

　　font-family：字体系列

　　font-weight：字体的粗细

　　font-size：字体的大小

　　font-style：字体的风格

　　2、文本系列属性

　　text-indent：文本缩进

　　text-align：文本水平对齐

　　line-height：行高

　　word-spacing：单词之间的间距

　　letter-spacing：中文或者字母之间的间距

　　text-transform：控制文本大小写（就是uppercase、lowercase、capitalize这三个）

　　color：文本颜色

　　3、元素可见性：

　　visibility：控制元素显示隐藏

　　4、列表布局属性：

　　list-style：列表风格，包括list-style-type、list-style-image等

　　5、光标属性：

　　cursor：光标显示为何种形态