首页 > 代码库 > css样式控制元素固定在底部
css样式控制元素固定在底部
回复固定在底部:css样式用到了
box-sizing属性
box-sizing:border-box;-moz-box-sizing:border-box; /* Firefox */-webkit-box-sizing:border-box; /* Safari */
box-sizing 属性允许您以特定的方式定义匹配某个区域的特定元素。
例如,假如您需要并排放置两个带边框的框,可通过将 box-sizing 设置为 "border-box"。这可令浏览器呈现出带有指定宽度和高度的框,并把边框和内边距放入框中。
为元素设定的宽度和高度决定了元素的边框盒。
就是说,为元素指定的任何内边距和边框都将在已设定的宽度和高度内进行绘制。
通过从已设定的宽度和高度分别减去边框和内边距才能得到内容的宽度和高度。
position:absolute 绝对布局
bottom:0 距离底部的距离
<div class="page" id="forum_details" data-pageTitle="查看全文"> <div class="all_text"> <div class="talk_item"> <div class="top"> <span class="fr">话题12</span> <h2> 微信昵称123<strong>07-19</strong> </h2> </div> <p class="mid"> 两市今天涨跌互现,个股活跃度虽然较低,但估值较适中、有成长性或者在改革大势里有成长潜力的公司得到市场认同 </p> </div> <div class="all_text_reply"> <p> <strong>张三:</strong>根据证券经纪业务的相关规定及财富证券集中交易系统使用规。 </p> <p class="reply"> <strong>王五 回复 张三:</strong>根据证券经纪业务的相关规定及财富证券集中交易系统使用规。 </p> </div> </div> <div style="width: 100%; padding: 0 1.5rem; box-sizing: border-box; position: absolute; bottom: 0;"> <a href="javascript:void(0);" class="mod_btn">回 复</a> </div> <!-- 弹窗 --> <div class="window" style="display: none;"> <div class="window_area"> <textarea name="comment" id="comment" cols="30" rows="10" placeholder="140个字以内"></textarea> <span class="btn_box"> <a href="javascript:void(0);" class="cancel">取消</a> <a href="javascript:void(0);" class="ok">发送</a> </span> </div> </div></div>
css样式控制元素固定在底部
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。