代码之家  ›  专栏  ›  技术社区  ›  Pfalbaum

css:将初始屏幕关闭按钮居中

  •  0
  • Pfalbaum  · 技术社区  · 5 年前

    在我的启动屏幕上,我想把页面底部的“关闭”(“X”)按钮居中,它必须调整自己以适应任何计算机或移动设备屏幕。在CSS中,可以从第206行开始。我试过这些东西:

    1. position: absolute
    2. 我试过不同大小的页边空白
    3. top: -999em; right: 10px;

    这是我的 CSS . 这是全部 App .

    除了在某些浏览器中移动之外,这个应用程序启动屏幕上的关闭按钮是按我的喜好放置的。我不知道他们是怎么做到的。 https://willcountygis.maps.arcgis.com/apps/StoryMapCrowdsource/index.html?appid=20ff154f5fbc4c99bc54bd2e6b8cea7e

    我能找到的最相似的问题是一篇文章,主要基于我的CSS: Splash Page with Pure CSS and close button

    1 回复  |  直到 5 年前
        1
  •  0
  •   Daniel    5 年前

    屏幕中元素的居中可以使用以下css完成。如果将它放在父元素中,请确保它在css中具有position属性。 您可以使用顶部和底部属性设置来定位它。

    .screenbutton {
      width: 120px;
      height: 120px;
      border-radius: 50%;
      background-color: lightblue;
      position: absolute;
      left: 0;
      top: 0;
      bottom: 0;
      right: 0;
      margin: auto;
    }
    <div class="screenbutton"></div>