添加文本时图像将移动

时间:2016-05-06 14:14:39

标签: html css image position

我仍然是初学者并且已经搜索了这个问题,但没有答案。我的欢迎'当我在HTML中的其他地方添加一些文本时,顶部的图像会移动一点。

当文字出现在我的图片下时,似乎会发生这种情况,但我试图将我的欢迎图片的位置设置为相对和绝对,与我的<p>文本相同,但它无济于事。我也尝试将我的欢迎图片放入div中,但也没有运气。

(请原谅我,我还没有使用相对路径。)

这是我的HTML顶部的欢迎图片中的HTML。

HTML欢迎图片

<img id="welcome"/>
<center>
<a href="file:///C:/Users/M%20de%20Witte/Desktop/html/index.html">
<img src="C:\Users\M de Witte\Desktop\html\welcome03vectorpng.png"    height="100px" /> </a>
</center>

CSS欢迎图片

#welcome{

height: 50px;
}

HTML P

 <p id="thisiswhatiliketdo">
 This is what I like to do
 </p>

CSS P

#thisiswhatiliketdo{

font-family: moon_flower_boldregular;
font-size: 30px;
float: right;
margin-top: 300px;
margin-right: 300px;

}

1 个答案:

答案 0 :(得分:0)

您的描述很难猜出您的设计应该是什么样子,但听起来您在图像和文字对齐方面遇到了麻烦。 HTML对齐属性的这个示例应该能够解决您的问题,以便您可以将欢迎图像放置在文本的上方,下方或旁边,而不会随着您向页面设计添加更多内容而移动。

http://www.w3schools.com/tags/att_img_align.asp

点击“尝试自己”按钮预览代码结果。

相关问题