HTML5 - img对齐中心不工作

我想在我的网页中间对齐我的个人资料图片，但似乎无法让它工作。我已经尝试了对齐=“中”&浮动方法，但它仍然拒绝离开左侧。HTML5 - img对齐中心不工作

我试图使用的代码（HTML5）是

<header> 
     <h1> Luke Johnson Portfolio</h1> 

     <div class="image-cropper" style="text-align"> 
      <img src="lukeprofile.jpg" align="center" alt="Luke Profile Pic" class="rounded" /> 

     </div> 
</header>

任何帮助，将不胜感激，谢谢。

来源

2017-10-08 LukeJ

align该图片的属性与网页上的文字或其他图片相对应（更多信息：https://www.w3schools.com/tags/att_img_align.asp）。

同时注意（从W3Schools的信息）：

“在HTML5不支持align属性使用CSS来代替。”

所以align属性不会做的伎俩在你的情况，你可以使用中间的图像：

img { 
    display: block; 
    margin: 0 auto; 
}

代替。下面是一个例子：

img { 
 
    display: block; 
 
    margin: 0 auto; 
 
}

<header> 
 
    <h1> Luke Johnson Portfolio</h1> 
 
    <div class="image-cropper" style="text-align"> 
 
    <img src="https://pbs.twimg.com/profile_images/378800000017423279/1a6d6f295da9f97bb576ff486ed81389_400x400.png" alt="Luke Profile Pic" class="rounded" /> 
 
    </div> 
 
</header>

来源

2017-10-08 01:27:20

@LukeJ，不客气 –

谢谢！很抱歉，如此晚的答复 - 感谢所有为此提供帮助的人 – LukeJ

您滥用内联样式标签，正确的使用情况如下：

<div class="image-cropper" style="text-align: center"> <img src="lukeprofile.jpg" alt="Luke Profile Pic" class="rounded" /> </div>

我可以帮助你更多，如果我有网址的网站。

来源

2017-10-08 01:26:11

兼容性说明 img标签的align属性不HTML5支持。改用CSS。

对于中间，顶部或底部对齐的图像使用CSS属性。

来源

2017-10-08 01:28:29

HTML5 - img对齐中心不工作

回答

相关问题