[分享]css中如何让图片显示上部分

在CSS中如何让图片显示在上部分 如果你想在网页上添加一张图片并让它显示在文字的上方，那么CSS是一个非常实用的工具。下面我们就来介绍一下CSS如何实现这个功能： 1. 首先你需要在HTML中插入一张...

在CSS中如何让图片显示在上部分

如果你想在网页上添加一张图片并让它显示在文字的上方，那么CSS是一个非常实用的工具。下面我们就来介绍一下CSS如何实现这个功能： 1. 首先你需要在HTML中插入一张图片，代码如下：

 <img src="images/picture.jpg" alt="这是一张图片"> 

2. 接着，在CSS中设置图片的样式，代码如下：

 img {
 
   display: block;   //设置图片元素为块状元素
 
   margin: 0 auto;   //设置图片水平居中
 
   margin-bottom: 10px;   //设置图片与下方文字的距离
 
 } 

3. 最后，在段落中添加文字，文字会自动显示在图片的下方，代码如下：

 <p>这是一段文字，图片在上方，显示效果非常好。</p> 

通过以上这些步骤，你可以轻松地让图片显示在段落文字的上方。当然，你还可以根据实际情况调整图片的大小和位置，来达到更好的显示效果。