回复固定在底部: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样式控制元素固定在底部的更多相关文章

  1. php部分:网页中报表的打印,并用CSS样式控制打印的部分;

    网页中报表的打印,是通过调用window对象中的print()方法实现打印功能的: 调用浏览器本身的打印功能实现打印 <a href="#" onclick="wi ...

  2. css 样式控制文本过长实现省略号

    css 样式控制文本过长实现省略号 .topicTitle{ text-overflow: ellipsis; max-width: 75%; overflow: hidden; white-spac ...

  3. 3种纯css方法控制元素隐藏显示

    1.通过hover,也是最常用的方式.此方法要求按钮与被控制元素必须有层级关系.(兼容低端浏览器常用) <div class="nav-btn"> <h2> ...

  4. python + selenium webdriver 复合型css样式的元素定位方法

    <div class="header layout clearfix"></div> 当元素没有id,没有name,没有任何,只有一个class的时候,应该 ...

  5. css的理解 ----footrt固定在底部

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. css样式控制 字符个数,多余的字用省略号代替

    大家好,我是小菜 前端 ,技术不高,正在努力中充电!希望大家多多指教 <div class="show">大家好,我是小菜 前端 ,技术不高,正在努力中充电!希望大家多 ...

  7. 用div和css样式控制页面布局

    <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...

  8. css样式控制鼠标滑过显示

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  9. css样式---隐藏元素

    1.通过设置width:0;或height:0 2.将元素的opacity设置成0 3.通过定位将元素移出屏幕范围 4.通过text-indent实现隐藏文字的效果 5.通过z-index隐藏一个元素 ...

随机推荐

  1. 多线程(实现Runnable接口)

    /** * 创建一个子线程, 完成1-100之间自然数的输出,同样的主线程执行同样的操作 *创建多线程的第二种方式,通过实现的方式 * 继承和实现的方式对比 * 一,联系: *  public cla ...

  2. http2新特性

    1.二进制分帧   http1.x是文本格式传输,http2二进制格式传输,并且被切分未过个帧发送,帧可以根据头部流标识重新组装.   2. 单一长连接   同一个域名使用一个TCP连接,(http1 ...

  3. android的布局-----FrameLayout(帧布局)

    (-)帧布局简介 帧布局容器为每个加入的其中的组件创建一个空白的区域称为一帧每个子组件占据一帧,这些帧都会根据gravity的属性执行自动对齐 (二)属性 foreground:这是帧布局的前景图像 ...

  4. manjaro中okular中的pdf文件无法显示中文

    最近发现Manjaro下用Okular打开含有中文的PDF文档时,许多地方显示空白, 开始怀疑是中文字体问题,但是其他的软件中文显示都是正常的. 接着,调整Okular中的中文字体,显示还是不正常. ...

  5. java使用DBCP连接池创建工具类

    1.说明 java中有个扩展包 javax下面有个DataResource的接口  javax.sql.DataResource 该接口定义了连接池的方法规范 而DBCP框架有apache公司开发,他 ...

  6. 聚类kmeans算法在yolov3中的应用

    yolov3 kmeans yolov3在做boundingbox预测的时候,用到了anchor boxes.这个anchors的含义即最有可能的object的width,height.事先通过聚类得 ...

  7. NanoPC-T3 64位裸机编程 —— 启动和运行状态切换

    参考: https://github.com/metro94/s5p6818_spl https://github.com/trebisky/Fire3/tree/master/Boot_NSIH h ...

  8. 详解Swift和OC的混编

    前言: 我们在一些情况下,仅仅使用swift 是无法完成一个项目的,在swift项目中必要用到 OC 实现一些功能,比如,项目要使用一些第三方的框架,但这个第三方的框架却是用 OC 实现的,或者你的项 ...

  9. 洛谷——P1962 斐波那契数列

    P1962 斐波那契数列 题目背景 大家都知道,斐波那契数列是满足如下性质的一个数列: • f(1) = 1 • f(2) = 1 • f(n) = f(n-1) + f(n-2) (n ≥ 2 且 ...

  10. Leetcode | Construct Binary Tree from Inorder and (Preorder or Postorder) Traversal

    Construct Binary Tree from Preorder and Inorder Traversal Given preorder and inorder traversal of a ...