分析思路, 从外到内. 从上到下的写
考虑盒子和内容的关系
在装图片的时候,在外面加一个盒子,避免图片没有加载出来的时候,布局塌陷
引入图片
图片宽度太大.溢出了.将右边的padding 盖住了. 将宽度变小处理.
将图片的宽度,设置 只写一个,会自动等比变化.
给图片加 边框线. 然后 再修改 img 的宽.
介绍栏内的分析
相同的三个,用 ul li
再写他的样式
字体加粗
再写 span 的 内容属性
代码简化
如果用p 标签 写 更理性一点. UI li 在这里,大材小用了.
然后对其 样式修改一下.就可以了.
问题汇总 :
1 ui li 之间包裹了其他的标签.
2 标签么有成对.
3缩进不对齐 名字写错
4 样式初始化 外边距合并问题.