0

画像が 1 つあれば、ポジショニングは問題ありません。ただし、その後ろに2番目のものを追加(position: relativeおよびz-index適用)すると、配置が歪んでしまい、divが以前よりも多くのスペースを占めるように見えます(両方とも同じdiv内に配置されています)。

両方とも同じサイズです。

ここに私のHTMLがあります:

<div class="resume-header">
    <a href="resume.pdf">
        <img src="media/resume-icon.png" alt="Resume icon" title="Download resume (PDF)" class="top-image" style="position:relative;z-index:2;">
        <img src="media/resume-icon-download.png" style="position:relative;right:132px;z-index:1;visibility:hidden;"><br>
        <span class="center-text">Resume (PDF)</span>
    </a>
</div>

おそらく関連する CSS:

.resume-header {
    display: inline-block;
    position: relative;
    left: 130px;
    text-align: center;
}

.resume-header a {
    color: #333;
    font: 10px "Lucida Grande", Helvetica, sans-serif;
    text-align: center;
    text-decoration: none
}
4

1 に答える 1

2

使用する場合は、要素を配置するために使用z-indexする必要があります。position: absolute

于 2013-01-23T17:05:30.580 に答える