WEB前端学习日志第二周 Day3

WEB前端学习日志第二周 Day3

今日总结：今天的学习内容主要是昨天没有完成的网页的制作，外加一些写网页时的附加知识，例如空白空间的处理、溢出属性等。

空白空间

1:空白空间的处理
white-space:;
pre 空白会被浏览器保留。其行为方式类似 HTML 中的 pre 标签。

pre-wrap 保留空白符序列，但是正常地进行换行。

pre-line 合并空白符序列，但是保留换行符。

inherit 规定应该从父元素继承 white-space 属性的值。

nowrap 文本不会换行，文本会在在同一行上继续，直到遇到
标签为止。

溢出属性

2:溢出属性（控制内容溢出时候的显示方式）：
overflow属性：
auto 当内容超出的时候有滚动条，没有超出的时候没有滚动条

scroll 添加滚动条

hidden 溢出隐藏！

inherit 继承！

省略号显示

3：text-overflow:ellipsis/clip

ellipsis 省略号显示

clip 没有省略号

在网页中单行文本溢出时：

控制单行文本，溢出 省略号显示：

1：white-space:nowrap; 不换行

2：overflow:hidden; 溢出的内容隐藏。

3：text-overflow:ellipsis 溢出的内容省略号显示

4：容器要有宽度！！！

网页制作

继续昨天的代码，该写网页的案例部分和新闻板块儿
代码如下
新闻板块儿的新闻用超链接a来写，并通过建立无序列表来实现

新闻板块儿的新闻用超链接a来写，并通过建立无序列表来实现
用css进行修饰


后续链接部分和底部与上面的方法基本一致最终得到的效果如图（原网页被缩小后的展示）