Question

我的网站上有一个徽标。差不多是第一件事。但它相当遥远。我想知道如何将其移动。该网站目前看起来像这样：http://i.gyazo.com/29b9116903051e82640f63b7a1a14464.png

正如您所看到的，徽标相当远，而不是靠近顶部。我对标题（其中包含徽标）的当前代码是：

<div id="header">
            <img src="images/Logo.png" alt="" height="150" style="left: 0px; top: 0px" width="150" />
            <h1>Hey there! I'm Mario!</h1>
            <p> <h2>  AKA IridiumKills </h2> </p>
            <p>I'm a Coder, Gamer, DJ, Music Producer, and Designer!</a>
            <br />
            Now that you know a bit about me,why don't you scroll down to see some more?</p>
            <p> <span class="logo fa fa-arrow-down"> </span> </p>
        </div>

这似乎解决了我的问题：

        <!-- Header -->
        <div id="header">
            <img src="images/Logo.png" alt="" height="225" style="position:absolute;left:565px; top:40px;" width="225" />
            <h1>Hey there! I'm Mario!</h1>
            <p> <h2>  AKA IridiumKills </h2> </p>
            <p>I'm a Coder, Gamer, DJ, Music Producer, and Designer!</a>
            <br />
            Now that you know a bit about me,why don't you scroll down to see some more?</p>
            <p> <span class="logo fa fa-arrow-down"> </span> </p>
        </div>

Answer 1

严格地说，这不仅仅是一个CSS问题，而是一个HTML问题。

您的内联css（ style = 内容）无效，因为您必须添加此内容：

style="position:absolute;left:0px; top:0px;"

您可能想要试验：

position:absolute;

VS

position:relative;

非常重要的说明：正如Chris Coyer在下面引用的文章中所指出的，绝对定位仅在您的元素位于div中，其中定位已设置为position:relative;时才有效。所以，添加：

<div id="header" style="position:relative;">

有关详细信息，请参阅以下参考资料。

来源：

http://css-tricks.com/absolute-relative-fixed-positioining-how-do-they-differ/

Answer 2

使用css制作

position:relative,
top: -10px;

使用最高价值直到满足您的需求

像这样内联它

style="position:relative; top:-10px;"

Answer 3

将此属性添加到图像的CSS中：

style: "position:relative;"

并修改＆＃34; top＆＃34;图像属性到您需要的位置：

top:-10px; //for example

如何将图像垂直向上移动？

3 个答案: