CSS笔记

书写布局的时候，不必太拘泥于“规则”，想办法达到你希望的效果就好。

移动端有些地方可以使用

rgba

里面的

a

的值来实现模拟一像素的效果。比如说：

rgba(255,255,255,0.1);

看起来就非常想一条一像素的白色实线。

如何两个 display 都为 inline-block 的元素紧挨在一起并且其父元素的 font-size 等于 0 ，此时这两个元素就会挤在一起，你就得不到你想要的布局效果，这个时候只要设置 vertical-align 就可以了，这个可以清除设置 font-size 带来的影响。

书写 CSS 代码的时候记得先写样式和布局，然后再写功能。

写布局，尤其是在写手机端布局的时候，一定要明白哪些是固定布局，哪些是自适应布局，从而做出合理的布局。对于自适应布局来说，使用 flex 布局是一个不错的方式。

1.给

<img>

标签的alt属性添加让人一听或者一看就能明白的内容。

2.搜索引擎会将

<h1>

视为仅次于

<title>

标签的另一个搜索关键词的来源。

3.几乎所有元素的display属性值要么为block，要么为inline。最明显买的一个例外是table元素，他有自己特殊的display属性值！

4.无论你想了解哪一个html元素，第一个要问的问题都应该是：它是块级元素还是行内元素。

5.块级元素盒子会扩展到与父元素同宽，行内元素盒子会“收缩包裹”其内容，并且会尽可能抱紧。

6.blockquote元素会默认缩进。

7.&ldquo和&rdquo，使用这两个引号的实体，能让页面显得更加专业。

8.用HTML来构建DOM，最后使用CSS来修改DOM。

9.

h1,h2,h3{color:blue}

把三个选择符组合在一起，就可以减少重复输入。（如果你想在后面单独为h3应用一条规则，在后面添加即可）

10.上下文选择符是以空格作为分隔，而分组选择符是以逗号作为分隔。

11.

p*{color:red;}

这样会把p包含的所有元素的文本变为红色。

section *a{color:red;}

任何是section的孙子元素，而非子元素的a标签都会被选中。至于a的父元素是什么，没有关系。

12.没有默认样式的span，由于我们没有明确为其添加样式，所以就继承了其父元素的样式。

13.ID也可以用在页内的导航链接中，目标是同一页的另一个位置。

14.ID值得唯一性对js尤其重要，否则就会导致js行为异常。

15.类的目的是为了标识一组具有相同特征的元素。**类可以应用给任意多个页面中任意多的
4000
HTML元素的公共标识符，以便我们为这些元素应用想用的样式。

16.继承和上下文选择符能让不同的标签共享样式，从而降低你需要编写和维护的css的量。**

17：滤镜效果

filter:blur(值越大越模糊)

18：在书写样式的时候，能用

class

就尽量用

class

，用标签的效率是非常低的。

19：table 是垂直居中最好的选择，尤其是当在一个块元素里面有一个换行的段落要居中时。