相关疑难解决方法(0)

CSS使页面页脚保持在页面底部的最小高度,但不与页面重叠

我有以下页面(deadlink :) http://www.workingstorage.com/Sample.htm,它有一个我无法坐在页面底部的页脚.

我想要页脚

  • 当页面很短并且屏幕未填满时,它会粘到窗口底部
  • 当有多个屏幕内容(而不是重叠内容)时,保持文档结束并正常向下移动.

CSS继承并迷惑我; 我似乎无法正确地改变它以在内容上放置最小高度或使页脚移到底部.

css footer

329
推荐指数
15
解决办法
94万
查看次数

试图让页脚坚持到底

这是我的网站 http://iadprint.com/services

我已经尝试了一切让页脚粘到底部但除了在标签#cright上设置css的高度之外什么都不会工作但是我不想这样做,因为动态内容会进入那里.任何人都可以看到我遗失或做错了什么?

谢谢

html css html5

13
推荐指数
1
解决办法
2万
查看次数

页面底部的Bootstrap页脚

我已经阅读了很多关于此的帖子,但我仍然没有找到答案. 我有一个页脚,我想要在页面的末尾,而不是修复. 问题是页脚是内容结束的地方.看图片. 在此输入图像描述

这是我的HTML:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8"/>
        <title> Mobtech - Privatni korisnici </title>

        <!--Ubaci bootstrap css -->
        <link rel="stylesheet" href="css/bootstrap.min.css">
        <link rel="stylesheet" href="css/style.css">
        <link rel="css/basic-template.css" rel="stylesheet">
        <link href="https://fonts.googleapis.com/css?family=Roboto+Condensed" rel="stylesheet">

    </head>
    <body>
        <!--Navigation bar -->
        <nav class="navbar navbar-default" role="navigation">
            <div class="container">
                <div class="navbar-header">
                    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar-container">
                        <span class="sr-only"> Pokazi i sakrij navigaciju </span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </button>
                    <a class="navbar-brand" href="#">
                         <span> <img src="Slike/logo.png" alt="LogoSlika"/> </span>
                        <font face="Roboto Condensed" size="4" color="green"> Mobtech </font>
                    </a> …
Run Code Online (Sandbox Code Playgroud)

html css twitter-bootstrap

13
推荐指数
2
解决办法
6万
查看次数

Bootstrap 4:页脚不在底部

我知道这个问题可能被问了数百遍,但可惜的是,我在这里找不到的答案确实对我有帮助。

我尝试了以下答案:

但是我仍然有一个问题,当页面内容“变小”并且没有填充主体/页面容器的整个高度时,页脚仅会浮动在浏览器窗口末尾的某个位置。

这是我的页脚的代码:

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.2/css/bootstrap.min.css" integrity="sha384-Smlep5jCw/wG7hdkwQ/Z5nLIefveQRIY9nfy6xoR1uRYBtpZgI6339F5dgvm/e9B" crossorigin="anonymous">
<footer class="d-flex justify-content-center">
  <div class="d-flex justify-content-between col-md-8 col-md-offset-2 mb-3 mt-5">
    <div class="align-left">
      <a class="font-weight-bold small kf-blue kf-links" href="#">Link1</a> |
      <a class="font-weight-bold small kf-blue kf-links" href="/">Link2</a> |
      <a class="font-weight-bold small kf-blue kf-links" href="/">Link3</a>
    </div>
    <div class="align-right small">
      Crafted with Love by <a class="font-weight-bold kf-blue kf-links" href="#" target="_blank">Me</a>
    </div>
  </div>
</footer>
Run Code Online (Sandbox Code Playgroud)

我使用的是Bootstrap 4.1和Chrome,这也是我网站的代码库:

https://codepen.io/anon/pen/oMZVxq

注意:您必须使用Codepen中的侧边栏视图才能实际看到页脚不在底部,因为Codepen中的视图尺寸太小以至于看起来正确。

html css bootstrap-4

7
推荐指数
2
解决办法
7594
查看次数

标签 统计

css ×4

html ×3

bootstrap-4 ×1

footer ×1

html5 ×1

twitter-bootstrap ×1