Question

我正努力使自己成为一个个人网站，在我的一个标签上，我有一份简历。问题只是png的前2/3实际可见。我已经尝试弄乱身高和溢出以及其他一些身体的东西，但是我似乎无法解决它或在网上找到任何东西。我知道这可能是一件简单的事情，但我无法弄清楚它会让人感到沮丧。这是指向我的网站http://adamphillips.us

的链接

这是我的png代码：

<section class="tab-item-3">
   <div class="download">
      <a href="Images/Adam_Phillips_Resume.pdf" target="_blank">Download my resume as a PDF file.</a>
   </div>       
   <div class="resume"> 
        <img src="Images/resume.png" alt="Resume">
   </div>
</section>

这是我的css：

.resume img {
    width: calc(100% - 60px);
    margin-top: 10px;
    border: medium solid black;
}

Answer 1

这样做......你可以将这个班级从旧的高度改为新的高度

＆＃13;

.clear-backend{
    height: 1550px;
}

＆＃13;

Answer 2

您的<div id='tab-content'>有overflow:hidden。顾名思义，这将隐藏溢出。删除溢出，页面将让您向下滚动以查看图像的其余部分。

Answer 3

这样可以正常工作。试试吧

.resume{
        height: 1650px;
        overflow-y: scroll;
}

Answer 4

每当您开始设计页面时（使用CSS）。始终为body提供一些属性。

因此，实际原因是overflow:hidden .tab-content而height没有body属性。

待办事项：

i）向body添加2个属性。

ii）从.tab-content删除1个属性。

尝试这个，它会像魅力一样工作。

body
{
    height:auto;
    overflow-x:hidden;
}

.tab-content
{
    position: absolute;
    top: 0;
    right: 0;
    width: calc(100% - 200px);
    height: 100%;
    padding-top: 60px; 
    /* JUST REMOVE OVERFLOW PROPERTY
    overflow:hidden
    */
}

我的网站不会让我向下滚动足够远，切断部分图像

4 个答案: