如何footer标签固定在底部不动

页脚那里用的是footer标签,可是如果不把菜单拉到底部的话他不会出现,我想把他固定在底部,应该怎样修改?代码如下:


 <footer class="shopping_cart">
<div class="fixed">
    <input type="hidden" id="totalprice" value="{$totalprice}" name="totalprice">
    <input type="hidden" id="totalcount" value="{$totalcount}" name="totalcount">
    <div  style="line-height:43px;" >已选:<span id="cartN"><span id="totalcountshow">{$totalcount}</span>份 总计:¥<span id="totalpriceshow">{$totalprice}</span></span>元
   <a  style="float:right;margin-right:10px;" class="xhlbtn comm_btn" href="{php echo $this->createMobileurl('wapmenu', array('from_user' => $from_user, 'storeid' => $storeid), true)}">选好了</a></div>
    </div>
</footer>

图片说明

0

6个回答

你给 已选:{$totalcount}份 总计:¥{$totalprice}元 放在一个div中设置样式{position:fixed;bottom:0px;}

1

已选:{$totalcount}份 总计:¥{$totalprice}元 选好了
</div>

0

已选:{$totalcount}份 总计:¥{$totalprice}元 选好了


0

position:fix;
固定定位。

0
csdn9_14
csdn9_14 position:fixed;
接近 3 年之前 回复
 <footer class="shopping_cart" style="position:fixed;left:0;bottom:0">
0

固定最常用的方法就是对其进行定位。
但在定位的时候需要注意:
①如果想固定在屏幕的某处,那么确定被固定的元素的父元素是body;
②为固定元素设置宽高。

比如给你的footer的class添加如下代码:

<style type="text/css">
    .shopping_cart {
        position: fixed;
        left: 0;
        bottom: 0;
        width: 100%;
        height: 60px;
        background: #eee;
        z-index: 10;
    }
</style> 
0
Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
其他相关推荐
footer固定在底部
<!DOCTYPE html> <html lang="zh-CN" style="height: 100%;"> <body style="display: flex; flex-direction: column; height: 100%;"> <header style="flex: 0 0 auto;">顶部</header> <section style="flex: 1
使footer固定在浏览器底部
只要做网页,就百分之九十九会做footer的布局。一般我们最想要的布局是,footer一直固定在网页的底部。如果网页内容不多,就把footer固定在可视区的底部。       总体布局一般是这样的:       I am header I am content I am footer 如果content的内容不多,不足以不footer撑到底部,就会出现这样的情况。
层固定在底部的样式 层固定在底部的样式
层固定在底部的样式 层固定在底部的样式 层固定在底部的样式
将footer固定在页面底部
1.设置body的高度至少充满整个屏幕,并且body作为footer绝对定位的参考节点; 2.设置main(footer前一个兄弟元素)的padding-bottom的值大于或等于footer的height值,以保证main的内容能够全部显示出来而不被footer遮盖; 3.设置footer绝对定位,并设置height为固定高度值。 header content
实现底部footer在内容较少时固定在页面底部
这里分享下自己已经实现了的,能够同时满足两种要求的固定底部footer的方法
前端:页面内容不够,始终把footer固定在底部
绝对定位 &amp;lt;!DOCTYPE html&amp;gt; &amp;lt;html lang=&quot;en&quot;&amp;gt; &amp;lt;head&amp;gt; &amp;lt;meta charset=&quot;UTF-8&quot;&amp;gt; &amp;lt;title&amp;gt;页面内容不够,始终把footer固定在底部&amp;lt;/title&amp;gt; &amp;lt;style&amp;gt; ht
使用flex实现一个固定在底部的footer
 要求: 实现一个footer页脚,内容不足一页时在底部显示,当内容超过一屏高度时依然在内容底部 实现要点: html要设置height为100% body要设置min-height为100% 必须直接将内容区包裹在body内,且display: flex; 给需要占满整屏的元素添加flex: 1;  &amp;lt;!DOCTYPE html&amp;gt; &amp;lt;html lang=&quot;en&quot;&amp;...
div固定在网页底部
css        position: fixed;bottom: 0;
如何将滚动条固定在底部
写了一个聊天的东西,需要让滚动条固定在底部,网上查了方法 $('#messageBox').scrollTop( $('#messageBox')[0].scrollHeight );,并不起作用,直接scrollTop(30000000)也不起作用,想问下还有没有方法n
sticky footer布局,页面不足一屏底部footer固定在视窗底部,否则底部footer自动向下顺延
  sticky布局在pc端和移动端都有很大的需求,下面列举一下常用并亲测的几种方法。 1.flex布局方式实现 &amp;lt;!DOCTYPE html&amp;gt; &amp;lt;html lang=&quot;en&quot;&amp;gt; &amp;lt;head&amp;gt; &amp;lt;meta charset=&quot;UTF-8&quot;&amp;gt; &amp;lt;title&amp;gt;兼容ie10+&amp;lt;/title&amp;gt; &am
如何将页脚固定在页面底部(sticky footer)
如何将页脚固定在页面底部
让web页面页脚footer固定在页面底部
有时候,我们发现很多页面内容不多的时候,页面底部内容飘到了中间: 这个页面底部没有固定,结果...,一个前端工程师是无法接受这样的结果的。 这里介绍一种通用的解决办法,让页面底部固定。 思路: 首先需要一个容器包裹所有的页面元素,这里使用&amp;lt;div id=&quot;container&quot;&amp;gt;&amp;lt;/div&amp;gt;来做。id为container的容器需要设置高度100%,否则,当内容较少的...
滚动条下拉DIV固定在头部不动
滚动条下拉DIV固定在头部不动 内包含js下载后可直接使用
网站导航条固定在网页顶部不动
position:fixed;
android 线性布局设置控件固定在底部
安卓设置控件置底
漂浮层,固定在屏幕底部怎么做??
想做一个漂浮层,让它始终固定在屏幕底部,不管你的屏幕上的是800*600还是1024*768,并且当滚动时也随时保留在底部。怎么做?谢谢大家!!
ScrollView+Fragment+Viewpager+位置固定在底部的线性布局
最外层是一个ScrollView 里面嵌套的是Fragment+Viewpager,Fragment有两个,里面的布局都是LIstView,最底下有一个线性布局,不管界面如何滑动,这个现象布局的位置是中固定在最下面
仿微信公众平台固定在底部弹出的导航菜单
仿微信公众平台固定在底部弹出的导航菜单,适用于手机端
css实现按钮固定在底部
想要把按钮固定在底部,让浏览器滚动时也不受影响。其实代码很简单的啦! css如下:<style> .r{position:fixed; bottom:0;} </style>html如下:<div> <div class="r"> <input type="submit" value="确认添加" class="btn btn-primary"/> </div>
微信小程序按钮悬浮固定在底部
微信小程序按钮悬浮固定在底部   其实这是一个很简单的小程序的样式,也就随手记录下来了。 &amp;lt;button class='Scancode' bindtap='getScancode'&amp;gt;绑定车辆&amp;lt;/button&amp;gt; wxss: .Scancode { font-size: 39rpx; background: #fff; position...
HTML页脚始终固定在底部
页脚固定在底部分两种情况考虑,一种是有滑动栏的情况,一种是没有的。后者比较简单,直接加上定位属性就是了,但是在页面内容是扩充整个页面以至于可以下滑浏览时,这时候单纯加上定位属性就不那么可行了,鉴于此我写了一个通用的js方法帮我搞定。 废话不多说,直接来干货 &amp;amp;amp;amp;lt;!DOCTYPE html&amp;amp;amp;amp;gt; &amp;amp;amp;amp;lt;html&amp;amp;amp;amp;gt; &amp;amp;amp;amp;lt;head
如何将底部固定在内容的最下面?
如何将底部固定在内容的最下面,条件是如果内容不够时,底部固定在浏览器的最下面。如果内容够多时底部就在内容的最后面!
html中,固定在底部的代码
html中,固定在底部的代码 这个方法简单好用。 运用这个CSS把DIV永远置于页面的底部 利用绝对定位,然后设置底部距离为0 &lt;style&gt; .footer{ left:0px; position:fixed; width:100%; height:30px; background-color:#000; color:#FFF; text-align:center; font-size:18px; font-weight:bold; bottom:0px;} &lt;/style&gt; <div class="footer">
[CSS]如何让一个DIV固定在另一个DIV的底部?
如rn rn rnrnrndiv1的高度是动态的,有没有什么CSS可以让div2固定在底部?rn类似于valign=bottom的效果
滚动条下拉时 table 的thead 固定在网页固定在顶部不动
一、效果图 二、前端页面 <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"> 场地预定 .table-chang{margin-left: 0px
请问如何把一个FieldManager固定在屏幕的底部啊?
请问如何把一个FieldManager固定在blackberry屏幕的底部啊?
请问如何定义一个固定在屏幕底部的div?
我的定义如下:rnrn[code=CSS]rn#footerrn background-color:green;rn margin:1px 0px 0px 0px;rn clear:both;rn position:relative;rn padding:1px 0px 1px 0px;rnrn[/code]rnrn可是当画面内容不到一屏幕时,它就不是固定在底部了,怎么样能让它固定在屏幕最下方?
如何让一个层始终固定在父层的底部?
我现在做了一个DIV1,DIV1的高度是自动的,我现在在这个DIV1中加一个小的DIV2,我想让这个小的DIV2随DIV1的高度变化,而始终在DIV1的底部,这个要怎么实现?rn谢谢啊!rnrnrn这个高度自动的rn这个要固定在底部rn
Css Sticky Footer将页脚固定在页面底部
概述:Css Sticky Footer 如果页面内容不够长的时候,页脚块粘贴在视窗底部;如果内容足够长时,页脚块会被内容向下推送。 实现方法: Css Sticky Footer *{padding:0; margin:0} html,body{height:100%;} .wrapper{min-height:100%; heigh
两种方式实现footer固定在页面最下方布局
第一种方式设置html、body高度100%,footer相对body定位:         Document             html {             height: 100%;         }         body {             margin: 0;             padding: 0;          
footer固定在网页底部且居中,超过一屏自动撑开(最简单的CSS实现)
html { height: 100%; } body { margin: 0; padding: 0; min-height: 100%; position: relative; } #footer{ position: absolute; left: 0; right: 0; bottom: 0; color: #969696; text-align: cente
阶段总结,移动端横竖屏切换、阻止长按默认行为、css控制footer固定在底部
1、横竖屏切换 属性:window.orientation: 90/-90 横屏; 0/180 竖屏 事件:orientationchange 2、阻止长按默认行为 android:e.preventDefault() ;同时修复touchend不能正常触发bug ios: *{ -webkit-touch-callout:none; -webkit-user-selec
#笔记 简单使用flex与sticky footer方式解决底部固定在底栏的问题
问题 许多大型网站都有一个底栏,不论内容的高度是否填满屏幕,底栏都一直在页面的最底部。这个效果看似简单,却有不少的“坑”,下面我来介绍两种方法解决这个问题。 第一个方法(引用中注释的css)使用了固定定位解决 第二种方法使用的是flex布局解决的 *具体请参考:<<css secret>> -41项 紧贴底部的页脚* 要注意的是第一种方法必须设置外层容器的最小高度为100% 第二种方法使
网页内容高度不够时,让footer处于页面底部的方法(不是固定在底部)
有时候我们的需求是,当页面内容高于可视高度时,footer跟在内容最后,下拉滚动条才会显示。 当页面内容少于一页,footer显示在最底部,而不是跟着内容显示到页面中间或其他位置。   先写好html内容 &amp;lt;body&amp;gt; &amp;lt;div class=&quot;content&quot;&amp;gt; &amp;lt;div class=&quot;main&quot;&amp;gt;main&amp;lt;/div&amp;gt...
tablayout固定在顶端
当tablayout上方还有其他布局只需要给其他布局添加app:layout_scrollFlags=&quot;scroll&quot; 就可以实现
添加武器模型,武器固定在相机前面不动
<p>n 通过一个的简单的ThreeJS示例(类似于射击小游戏)实操n,让大家可以在实际开发练习中由简单到复杂,分阶段,循序渐进的掌握ThreeJS开发的常用的一些重要知识点.n</p>n<p>n 课程主要知识点介绍:<br />n1 Threejs三大组件,相机、渲染器和场景的介绍<br />n2 在场景中如何创建几何体及一些旋转动画的实现,及对象的显示方式<br />n3 控制相机向前,向后移动,向左,向右旋转<br />n4 光源的介绍,及如何给场景添加不同的光源<br />n5 怎样给不同的对象添加阴影<br />n6 给对象添加材质,几种不同材质的区别及应用<br />n7 贴图的种类及各种不同贴图的效果<br />n8 自定义模型及其材质的加载及如何在场景对模型的定位<br />n9 怎样场景切换,及对切换场景的管理loadingManager<br />n10 通过for循环对多个对象的加载,克隆模型,这样可以拥有100个对象,所有对象都使用相同的几何体。<br />n11 第一人称武器的视角控制<br />n12 子弹的产生和发射效果<br />n13 怎样实现定时器来控制子弹的发射频率<br />n14 为武器添加有节奏的动作<br /></p>n<p>n <br /></p>n<p>n <br /></p>
按钮固定在页面底部
按钮不随GridView行数的变化而上下移动,始终固定在页面底部。
固定在顶部的进度条
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" /> <
CSS设置组件固定在顶部和固定在右下角
固定在顶部 position: fixed;/*固定位置*/ top:expression(documentElement.scrollTop + &quot;px&quot;); z-index:9999;/*设置优先级显示,保证不会被覆盖*/ 将多个组件固定在右下角 /*选择回顶部,前一页,后一页按钮*/ .select_top_button{ positio...
footer 粘连底部例子
粘连底部: 可以随浏览器的大小来自动的调节高度!
相关热词 c#异步发送kafka c#窗体编号 c# 操作二进制文件 c# 反射 机制 c#线程 窗体失去响应 c#角度转弧度 c# 解析gps数据 c# vs设置 语法版本 c# json含回车 c#多线程demo