<!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="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
<title>出师表</title>
<style type='text/css'>
html, body {
margin: 0;
padding: 0;
}
body {
/* 这里不能加position: relative */
}
#content {
font-family: 微软雅黑;
font-size: 36px;
line-height: 60px;
width: 800px;
margin: 0 auto;
}
#content p {
text-indent: 2em;
}
#overlay {
opacity: .5;
filter: alpha(opacity=50);
background: #cccccc;
width: 100%;
height: 50px;
position: fixed;
_position: absolute;
bottom: 0;
}
</style>
</head>
<body>
<div id='content'><p>先帝创业未半，而中道崩殂；今天下三分，益州疲敝，此诚危急存亡之秋也。然侍卫之臣，不懈于内；忠志之士，忘身于外者：盖追先帝之殊遇，欲报之于陛下也。诚宜开张圣听，以光先帝遗德，恢弘志士之气；不宜妄自菲薄，引喻失义，以塞忠谏之路也。宫中府中，俱为一体；陟罚臧否，不宜异同：若有作奸犯科，及为忠善者，宜付有司，论其刑赏，以昭陛下平明之治；不宜偏私，使内外异法也。侍中、侍郎郭攸之、费依、董允等，此皆良实，志虑忠纯，是以先帝简拔以遗陛下：愚以为宫中之事，事无大小，悉以咨之，然后施行，必得裨补阙漏，有所广益。将军向宠，性行淑均，晓畅军事，试用之于昔日，先帝称之曰"能"，是以众议举宠为督：愚以为营中之事，事无大小，悉以咨之，必能使行阵和穆，优劣得所也。亲贤臣，远小人，此先汉所以兴隆也；亲小人，远贤臣，此后汉所以倾颓也。先帝在时，每与臣论此事，未尝不叹息痛恨于桓、灵也！侍中、尚书、长史、参军，此悉贞亮死节之臣也，愿陛下亲之、信之，则汉室之隆，可计日而待也。</p><p>
臣本布衣，躬耕南阳，苟全性命于乱世，不求闻达于诸侯。先帝不以臣卑鄙，猥自枉屈，三顾臣于草庐之中，谘臣以当世之事，由是感激，遂许先帝以驱驰。后值倾覆，受任于败军之际，奉命于危难之间：尔来二十有一年矣。先帝知臣谨慎，故临崩寄臣以大事也。授命以来，夙夜忧虑，恐付托不效，以伤先帝之明；故五月渡泸，深入不毛。今南方已定，甲兵已足，当奖帅三军，北定中原，庶竭驽钝，攘除奸凶，兴复汉室，还于旧都：此臣所以报先帝而忠陛下之职分也。至于斟酌损益，进尽忠言，则攸之、依、允等之任也。愿陛下托臣以讨贼兴复之效，不效则治臣之罪，以告先帝之灵；若无兴复之言，则责攸之、依、允等之咎，以彰其慢。陛下亦宜自谋，以谘诹善道，察纳雅言，深追先帝遗诏。臣不胜受恩感激！今当远离，临表涕泣，不知所云。</p>
</div>
<div id='overlay'></div>
<!--[if IE 6]>
<script type="text/javascript">
(function(){
var overlay = document.getElementById('overlay'), t;
window.onscroll = function() {
t && clearTimeout(t);
t = setTimeout(function() {
// reflow
overlay.className = overlay.className;
}, 13);
};
})();
</script>
<![endif]-->
</body>
</html>
分享到：
相关推荐
本文将详细介绍如何使用JavaScript和HTML来实现一个动态的网页底部菜单栏。 首先，我们需要创建HTML结构。底部菜单栏的基本元素通常是`<ul>`列表，其中包含一系列的`<li>`列表项，每个列表项内部嵌套一个链接`<a>`...
手机网页底部悬浮固定导航是一种常见的网页设计技巧，它在用户滚动页面时始终保持在屏幕底部，提供便捷的导航链接或操作按钮。这样的设计尤其适用于移动设备，因为它们可以帮助用户轻松访问关键功能，无论他们在页面...
首先，我们来详细讨论页面高度和底部定位的关系。在网页设计中，底部信息通常被设计为固定在页面底部，无论用户滚动页面到何处，这个区域始终保持可见。这种设计模式被称为“固定定位”（fixed positioning）。然而...
运用这个CSS把DIV永远置于页面的底部 利用绝对定位，然后设置底部距离为0 <style> .footer{ left:0px; position:fixed; width:100%; height:30px; background-color:#000; color:#FFF; text-align:center; ...
"footer.html" 文件则是网页底部的HTML结构。HTML5是超文本标记语言的最新版本，增加了许多新的语义元素，以更好地表达网页内容。在网站底部，开发者可能使用`<footer>`元素来包裹底部区域，同时使用`<nav>`定义导航...
网页底部浮动导航条是网页设计中的一个重要元素，它通常位于页面的最下方，始终保持在用户的视线范围内，即使用户滚动页面也不会消失。这种设计可以提供便捷的用户体验，使用户能够快速访问网站的主要链接或功能，...
在本压缩包“css3网页底部波浪特效.rar”中，包含的是一个使用CSS3实现的网页底部波浪效果的示例。这个效果通常用于网页设计中，为页面增添动态感和视觉吸引力，使得网站看起来更加生动有趣。下面将详细解释如何通过...
标题"固定页面头部和底部中间滚动"涉及到了网页布局设计的一个常见需求，即如何在HTML页面中实现头部和底部固定，而中间内容区域可以滚动。这样的设计可以提供良好的用户体验，使用户在浏览长页面时能始终保持导航...
在网页设计中，保持页脚始终位于页面底部是一项常见的需求，尤其在内容量不固定或者内容较少时，确保页脚不会因为页面内容不足而上移，这样可以提供更好的用户体验。本话题将深入探讨如何通过HTML和CSS技术实现...
在网页设计中，创建一个始终位于页面底部的菜单是常见的需求，这有助于提供一致的导航体验，无论用户滚动到页面的哪个位置。本文将深入探讨如何使用JavaScript来实现这一功能。 首先，我们需要理解页面布局的基本...
- **bottom**: 定位元素底部与最近的已定位祖先元素之间的距离。 - **left**: 定位元素左边与最近的已定位祖先元素之间的距离。 - **right**: 定位元素右边与最近的已定位祖先元素之间的距离。 **4.4 静态定位** ...
在网页设计中，"页面最底部悬浮层"是一种常见的交互设计模式，它使得特定的元素如联系方式、导航菜单或广告始终固定在用户浏览器窗口的底部，无论用户滚动页面到何处，该元素始终保持可见。这种设计可以提高用户体验...
JavaScript在网页开发中的作用不可忽视，它可以为静态的HTML页面添加动态功能和交互性。 实现网页底部浮动通栏的技术主要包括HTML、CSS和JavaScript三大部分： 1. HTML（HyperText Markup Language）：用于构建...
在HTML5中，实现输入框`fixed`定位在屏幕最底部的兼容性是一个常见的挑战，尤其是在面对各种设备、浏览器和输入法的差异时。这里我们将深入探讨如何解决这个问题，并提供几种可能的解决方案。 首先，问题的根源在于...
【CSS3网页底部固定导航】是一种常见的网页设计技术，它利用CSS3的特性来实现在用户滚动页面时，导航栏始终保持在屏幕底部的效果。这样的设计不仅增强了用户体验，还能确保用户在浏览网页时始终能轻松访问导航链接。...
通过这个"始终居于浏览器底部的在线客服QQ代码"，开发者可以快速地为自己的网站添加这一实用功能，同时也可以作为学习和理解CSS定位、JavaScript交互的一个实例。希望这个资源能对你的项目带来帮助，同时也激发你...
总结，创建一个仿微信底部固定响应式导航菜单涉及HTML5的结构元素和CSS3的布局、定位、响应式设计、动画效果等技术。通过合理的布局和样式设计，可以实现与微信类似的功能，同时确保在各种屏幕尺寸下的良好用户体验...
在本案例中，“html5仿安卓Dock页面底部固定层图标导航按钮特效”是一个利用HTML5技术实现的网页设计示例，它模仿了Android操作系统中的Dock栏设计。Dock栏是手机或平板电脑界面中常见的元素，通常位于屏幕底部，...
网页底部的浮动通栏与导航条是网页设计中常见的元素，它们为用户提供了一种便捷的交互方式，即使在页面滚动时也能保持可见。这个主题主要涉及CSS（层叠样式表）布局技术，包括定位（positioning）、固定定位（fixed ...
本项目名为“jQuery网页底部固定横幅图片广告代码”，它提供了一种优雅的解决方案，使广告既能保持在用户视线范围内，又不会过度干扰用户体验。通过使用jQuery库，这个代码实现了广告的动态收缩和展开功能，提高了...