将图像定位在网页的右上角

时间:2015-09-01 06:57:30

标签: html css

我想在文本的顶部和右侧放置一些图像...我在Photoshop中做了一个例子,这样你就可以看到我的想法....

Image example

我正在使用WordPress主题,我无法弄清楚如何将此图像放在右上角...是的,我确实搜索了谷歌,但我没有找到任何合适的解决方案。

我试过作为div的背景图片,但图片不能超越div的范围......

我尝试使用img标签,但它将文本推向左侧...但我需要文本覆盖图像以创建所需的效果

提前谢谢。

3 个答案:

答案 0 :(得分:2)

添加css

body{
background-image:url("your image path");
background-position: right top;
background-repeat:no-repeat;background-attachment:fixed;
}

Fiddle

答案 1 :(得分:2)

这就是我所做的:

img {
    width: 400px;
    height: 400px;
    position: absolute;
    right:0;
    top:0;
}
div {
    position: absolute;
    left: 0;
    top: 150px;
    background-color: white;
    width: 80%;
}

Here is the JSFiddle demo

答案 2 :(得分:0)

在图像中添加类,即          .toprightcorner {position:absolute;顶部:0;右:0; } 应用css后。希望它成功。如果不让我知道。