作为一个页面开发的小白,今天刚学习了一些基本的基本的html基础,在制作唐诗解析的界面时遇到一些小小的问题,和大家在此分享一下:
- 错误1:整块古诗想居中,但前缀使用
<span>
,结果就是并未居中;
对应解决方法:<p></p>
为段落标签;<span></span>
为文字设置单独样式;假如要为某一个段落设置样式,我们使用嵌入式的时候,可以这样写<p style="color:blue">
某一个段落</p>
假如要为几个字设置样式时,我们使用嵌入式的时候,可以写成<span style="color:blue">
某几个字</span>
- 错误2:吸取了上面错误的教训,我把“唐诗赏析” 标题和作者都改成了
<span class="jz jicu bt">唐 诗 赏 析 </span>
<span class="jz jicu"> 赠 卫 八 处 士</span>
<span class="jz">杜甫</span>
结果发现,不显示上面三行的内容了…
对应解决方法: 不要设置文字的样式,只要你有段落就会用到<p></p>
,如果不设置文字样式的话,用不到<span></span>
;而我只有最开始的“唐诗赏析”用到了特定字体,也就是说,如果不涉及文字样式的话,用<span>
是没有用的
- 错误3:待我把不涉及文字样式的行重新改成了
<p></p>
后,重新更改“唐诗赏析”。但发现还是不可以
<p ><span class="jz jicu bt">唐 诗 赏 析 </span> </p>
<p class="jz jicu"> 赠 卫 八 处 士</p>
<p class="jz">杜甫</p>
对应解决方法: 最后重新改成了这个后就成功了。
<p class="jz jicu bt"><span>唐 诗 赏 析 </span> </p>
其实上面的几个问题可以直接不涉及到<span>
,去掉<span>
直接
<p class="jz jicu bt">唐 诗 赏 析 </p>
也可以实现;当然,用<div>
也可以的
这个博客里面讲的很清楚https://developer.mozilla.org/zh-CN/docs/Learn/CSS/Building_blocks/The_box_model