`
juzhibest
  • 浏览: 55284 次
  • 性别: Icon_minigender_1
  • 来自: 济南
社区版块
存档分类
最新评论

div一直在页面底部

 
阅读更多
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"  xml:lang="zh-CN" lang="zh-CN">
<head>
<style type="text/css">
html,body {
width:100%;
height:100%;
margin:0px;
padding:0px;
overflow:hidden;
}
#Main {
position:absolute;
bottom:0px;
left:0px;
width:100%;
height:100%;
overflow:auto;
z-index:1;
}
#ToolBar {
position:absolute;
bottom:0px;
right:16px;
width:100%;
height:20px;
text-align:center;
background:#ccc;
z-index:2;
overflow:hidden;
}
</style>
</head>
<body>
<div id="ToolBar">固定在页面底部不动</div>
<div id="Main">
<p><strong>09即将流行的经典语录</strong></p>
<div class="clear">&nbsp;</div>
<div class="info clearfix">
<p class="date">&nbsp;</p>
</div>
<div class="blog_content" id="blog_content">TOP1 <br />
人生的最大遗憾莫过于错误地坚持了不该坚持的,轻易地放弃了不该放弃的&hellip;&hellip; <br />
TOP2 <br />
TOP25 <br />
你看得见我打在屏幕上的字,却看不到我掉在键盘上的泪

</div></body>

</html>
分享到:
评论

相关推荐

    纯css 实现footer 一直在页面底部,不随页面滚动

    在网页设计中,将footer元素固定在页面底部是一个常见的需求,尤其在页面内容不足以填满整个视窗时。传统的做法可能涉及JavaScript或复杂布局的HTML结构,但CSS提供了一种简单而优雅的方式去实现这一布局需求。本...

    vue 每次渲染完页面后div的滚动条保持在最底部的方法

    在Vue.js中,页面的动态内容更新会导致滚动条位置发生变化,特别是在列表或聊天窗口这类高度动态的场景中,用户希望能够保持滚动条在最新的内容区域,即通常所说的“滚动到底部”。为了实现这一功能,Vue提供了几个...

    vue进入页面时滚动条始终在底部代码实例

    在Vue.js应用中,有时我们需要实现一个功能,即当用户首次加载或切换到某个页面时,滚动条自动定位到页面底部。这通常适用于聊天界面、实时更新内容等场景,让用户一进入页面就能看到最新的信息。以下是一个具体的...

    vue 中滚动条始终定位在底部的方法

    在使用Vue框架开发前端页面时,经常需要处理列表滚动以及保持滚动条在特定位置的需求。例如,在聊天应用、实时消息显示或者日志查看等场景中,使滚动条保持在视图的底部,以便用户始终看到最新的内容,是非常常见的...

    让DIV一直固定在屏幕的某个位置示例代码

    ` - 这些值决定了`&lt;div&gt;`距离屏幕底部和右边的距离,使得它固定在屏幕的右下角。 5. `border: 8px double #06F867;` - 定义了一个8像素宽的双线边框,颜色为#06F867。 6. `text-align: center;` - 使`&lt;div&gt;`内部的...

    div常用技巧

    这样,背景颜色或图片就会从顶部一直延伸到底部,覆盖整个页面。 #### 八、block/inline元素的区别 HTML元素根据其默认的显示行为可分为`block`和`inline`两种类型。`block`类型的元素会在页面中独占一行,并且可以...

    jQuery实现DIV响应鼠标滑过由下向上展开效果示例【测试可用】

    在IT领域中,Web前端技术的实现和应用一直是开发者们关注的焦点。本文将详细解析如何使用jQuery实现一个DIV元素在鼠标滑过时,从下方缓慢向上展开的效果。这一效果的实现,主要依赖于jQuery库提供的事件响应和动画...

    Selenium 模拟浏览器动态加载页面的实现方法

    在代码中,如果定位到了页面底部的换页tab,就说明已经加载完毕,可以跳出循环。 9. Selenium中的异常处理 在使用Selenium进行元素查找等操作时,可能会遇到元素不存在的情况,这时会抛出NoSuchElementException...

    AmazeUI 固定元素

    这在创建导航栏、侧边栏或者页脚等需要一直可见的元素时非常有用。 AmazeUI 提供了一套简洁且实用的 CSS 类来帮助开发者快速实现固定定位。固定定位是 CSS 定位模型的一部分,通过 `position: fixed` 属性实现。...

    浮动代码 

    这种技术在现代网页设计中非常常见,为用户提供了一种便捷的方式去访问或者关注某些重要的信息,而不必一直滚动到页面顶部或底部。 在"浮动窗口代码"中,`浮动/index.htm`可能是指一个示例文件,用于演示如何实现...

    移动端解决悬浮层(悬浮header、footer)会遮挡住内容的3种方法

    在现在的前端页面中,尤其是移动端,经常会需要将或者是模块悬浮出来,跟随页面的滑动保持定位在页面的最上方或者是最下方,如下图所示。 “回复主题”模块,就是跟随页面的浮动一直悬浮在页面的最下方,代码结构...

    JavaScript实现图片自动加载的瀑布流效果

    为了加载更多图片,我们可以在页面底部添加新的图片元素,并更新数组中的高度值,以便正确地放置新加载的图片。 整个瀑布流布局的实现,需要依赖于HTML、CSS和JavaScript三者的共同协作。HTML负责定义页面的结构,...

    Surfingkeys-crx插件

    DIV 0一直滚动到左侧e向上滚动页面d滚动向下滚动gg滚动到页面顶部G滚动到页面底部j向下滚动k向上滚动h向左滚动l向右滚动$一直向右滚动%滚动到当前页面的百分比cS重置滚动目标cs更改滚动目标#捕获整页/ DIV yG捕获...

    让你的博客飘雪花超出屏幕依然看得见

    看了下代码后发现,原作者是在body中不停的插入多个小div雪花来向下慢慢飘,一直飘到body的底部后,将雪花移除。 但是,实际上,超出屏幕的页面我们又看不见,就算有雪花在飘又有什么意义呢。 于是,将原来的代码...

    react-infinite-scroll:ReactJS无限滚动方法

    无限滚动,也称为滚动加载或无尽滚动,是一种网页设计模式,当用户滚动到页面底部时,新的内容会自动加载到页面上,无需点击“加载更多”按钮。这种设计在社交媒体、电子商务网站和博客等场景中广泛应用。 React-...

    学生DW静态网页设计 红色中国文化主题网站设计 ——美丽中国1页HTML+.md

    - **关键技术点**:Div+CSS布局、鼠标悬停效果(Hover)、表格(Table)、表单(Form)、导航栏(Navigation Bar)、Banner设计、二级/三级页面链接、多媒体元素(视频、音频、Flash)的集成等。这些技术点不仅涵盖了HTML和CSS...

    工程硕士学位论文 基于Android+HTML5的移动Web项目高效开发探究

    除在保密期内的保密论文和在技术保护期限内的论文外,允许论文被查阅和借阅,可以公布(包括以电子信息形式刊登)论文的全部内容或中、英文摘要等部分内容。论文的公布(包括以电子信息形式刊登)授权东南大学研究生...

Global site tag (gtag.js) - Google Analytics