CSS未固定在页面底部

编程入门 行业动态 更新时间:2024-10-24 01:58:38
本文介绍了CSS未固定在页面底部的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧! 问题描述

我无法将页脚固定在页面底部.当数据较大时,页脚显示在我需要放在页面底部的数据上.以下是我的代码,请告诉我我做错了.

i am not able to fix my footer at the bottom of the page.when the data is large in,the footer is showing on the data which i need to put on bottom of the page.below is my code please tell me what i am doing wrong.

<!doctype html> <html class = "no-js" ng-app = "PreSales-Huddle" lang = "en"> <head> <meta charset = "utf-8"> <title ng-bind = "title"> </title> <meta name = "description" content = ""> <meta name = "viewport" content = "width = device-width"> <link rel = "stylesheet" href = "maxcdn.bootstrapcdn/bootstrap/3.2.0/css/bootstrap.min.css"/> <link rel = "stylesheet" href = "styles/main.css"> <link rel = "stylesheet" href = "cdnjs.cloudflare/ajax/libs/bootstrap-datepicker/1.3.0/css/datepicker.min.css"> <link rel = "stylesheet" href = "netdna.bootstrapcdn/bootstrap/3.1.1/css/bootstrap.min.css"> <head profile = "www.w3/2005/10/profile"> <meta name="google-signin-scope" content="profile email"> <style> body { background-size: cover; background-position: top center; } .footer { text-align: center; width: inherit; color: #747474; border-top: 1px solid #e5e5e5; position: static; bottom: 0; margin-top: 75%; padding-right: 0%; font-family: calibri; } </style> </head> <body> <div class = "container" > <header class = "header"> </header> <div class="title" id="titleText" disabled>ABC</div> <main class = "main" id = "main"> <div ng-view = ""></div> </main> <footer class = "footer" id="footer"> <p><span style="background-color:whitesmoke">footer. </span></p> </footer> </div>

推荐答案

为类 footer 内部写入位置:固定,底部:0 css.

Write position: fixed, bottom: 0 for class footer inside css.

.footer { position: fixed; bottom: 0; }

更多推荐

CSS未固定在页面底部

本文发布于:2023-11-26 08:10:16,感谢您对本站的认可!
本文链接:https://www.elefans.com/category/jswz/34/1633320.html
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,我们将在24小时内删除。
本文标签:页面   CSS

发布评论

评论列表 (有 0 条评论)
草根站长

>www.elefans.com

编程频道|电子爱好者 - 技术资讯及电子产品介绍!