3.25笔记

新闻列表的流程：
1 :结构:
a:如果新闻后面有时间:
<li>
<a href="#"> 新闻条新闻条新闻条新闻条新闻条</a>
<span>2020-3-25</span></li>
b:如果没有时间
<li >
href="#">新 闻条新闻条新闻条新闻条新闻条</a>
</1i>
2:给li添加宽高，高度量取的时候，量行高就行。
3:给新闻内容a和时问的span添 加浮动。一左一右
4:设置文本样式。
5:用添加背景图的形式给li添加列表符合

图片加载时避免后期更新图片时失真，要给图片加上：img{height:100%;wigth:10
0%;}
在图片的默认情况下，给父元素加上{text-align:center},对图片是起作用的。
a与a之间默认的有间距，所以要给a加上float：left,可以消除默认间距
1.空白空间的处理：
white-space:pre/pre-wrap/pre-line/nowrap;
不让文本换行。
2.隐藏溢出文本：
overflow: auto/scorll/hidden;
overflow-x:hidden ;overflow-y : hidden;
3: text -overflow:ellipsiss/clip
ellipsis省略号显示clip没有省略号
控制单行文本，溢出省略号显示:
1: white-space:nowrap; 不换行
2: overflow:hidden;溢出的内容隐藏。
3.text-overflow:ellipsis 省略号
4:容器要有宽度。