今天完成的事情：晚上的时间全耗在友情链接那里了，把任务一的友情链接用媒体查询做了一遍，可以无缝切换 不会塌陷

明天计划的事情：任务二三

遇到的问题：

1：为什么我把div块状元素用display：inline/转为内行元素，它们不再一行,

     经过自己的测试，发现只在父极div设置display：inline，子元素是不继承的，坑死我了，搞半天，还以为可以继承

2. 媒体查询同样的条件不能出现两次，前面的会覆盖后面的条件，媒体查询放在代码最后面，不然会出现很严重的问题，后面css样式不起作用了。，，

收获：媒体查询还是比较好理解的，用习惯了会很顺手，今晚90%的时间都去研究布局去了，自适应比较好设置

2018-5-21

1.content: "";有什么用？

  content 属性与 :before 及 :after 伪元素配合使用，来插入生成内容。

 好像还有撑开属性功能 目前无法理解 代码如下

 这段代码中的content: ".";有什么用，解决了什么问题，为什么要用他？

 .clearfix:after {

 clear: both;

 content: ".";

 display: block;

 height: 0;

 visibility: hidden;

}

strivelifetime | 浏览 28718 次 |举报

我有更好的答案

推荐于2017-09-30 10:43:11 最佳答案

在写HTML代码的时候，发现在Firefox等符合W3C标准的浏览器中，

如果有一个DIV作为外部容器，内部的DIV如果设置了float样式，

则外部的容器DIV因为内部没有clear，导致不能被撑开。

这个clearfix的CSS使用了after这个伪对象，

它将在应用clearfix的元素的结尾添加content中的内容。

在这里添加了一个句号"."，并且把它的display设置成block；

高度设为0；clear设为both；visibility设为隐藏。这样就达到了撑开容器的目的啦。

2.如何在内容宽度超过100%后自动换行？

  在属性里添加word-wrap:break-word; word-break:break-all;这行代码即可

  word-wrap：允许长单词换行到下一行

  word-break：在恰当的断字点进行换行

3.:样式::before {属性｝

before 选择器在被选元素的内容前面插入内容。

请使用 content 属性来指定要插入的内容。

4：active 选择器

定义和用法

:active 选择器用于选择活动链接。

当您在一个链接上点击时，它就会成为活动的（激活的）。

提示：请使用 :link 选择器对指向未被访问页面的链接设置样式，

:visited 用于设置指向已访问页面的链接的样式，

:hover 选择器用于设置鼠标指针浮动到链接上时的样式。

5.元素转换

1.display:inline;转换为行内元素

2.display:block;转换为块状元素

3.display:inline-block;转换为行内块状元素