当前位置:编程学习 > html/css >>

CSS里,图片横排和文字横排(图片各自的内容在下面)

答案:一个div,div里面两个<p>段落,上面一个<p>里放图片,下面一个<p>里放文字。比如 <div> <p><img src="图片" /></p> <p>文字</p> </div>
其他:在里面再一句.center ul li 就行了 <style type="text/css">
.piclist{margin:0;padding:0;list-style-type:none;width:100%;}
.piclist li{float:left;width:200px;height:200px;}
.piclist img{display:block;margin:0 auto;width:150px;height:150px;border:1px solid #ccc;}
.piclist p{text-align:center;}
</style>

	<ul class="piclist">
		<li>
			<img src="第一张" alt="" />
			<p>第一张</p>
		</li>
		<li>
			<img src="第二张" alt="" />
			<p>第二张</p>
		</li>
		<li>
			<img src="第三张" alt="" />
			<p>第三张</p>
		</li>
		<li>
			<img src="第四张" alt="" />
			<p>第四张</p>
		</li>
		<li>
			<img src="第五张" alt="" />
			<p>第五张</p>
		</li>
	</ul>

不懂再问

上一个:怎样改变Firefox里滚动条的颜色 用css
下一个:如何用div+css压缩图片

CopyRight © 2022 站长资源库 编程知识问答 zzzyk.com All Rights Reserved
部分文章来自网络,