<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<style type="text/css">
<!--
.mydiv {
background-color: #FFCC66;
border: 1px solid #f00;
text-align: center;
line-height: 50px;
font-size: 12px;
font-weight: bold;
width: 300px;
height: 100px;
left:50%;/*FF IE7*/
top:50%;/*FF IE7*/
margin-left:-150px!important;/*FF IE7 该值为本身宽的一半 */
margin-top:-50px!important;/*FF IE7 该值为本身高的一半*/
margin-left:0px;
margin-top:0px;
position:fixed!important;/*FF IE7*/
position:absolute;/*IE6*/
_top: expression(eval(document.compatMode &&
document.compatMode=='CSS1Compat') ?
documentElement.scrollTop + (document.documentElement.clientHeight-this.offsetHeight)/2 :/*IE6*/
document.body.scrollTop + (document.body.clientHeight - this.clientHeight)/2);/*IE5 IE5.5*/
_left: expression(eval(document.compatMode &&
document.compatMode=='CSS1Compat') ?
documentElement.scrollLeft + (document.documentElement.clientWidth-this.offsetWidth)/2 :/*IE6*/
document.body.scrollLeft + (document.body.clientWidth - this.clientWidth)/2);/*IE5 IE5.5*/
}
-->
</style>
</head>
<body>
<div class="mydiv">网页设计大本营欢迎你！<br/>Q群号:26868887</div>
<div style="width: 1500px; height: 1500px;"></div><!--大div,只是使页面出现滚动条以便观看效果 -->
</body>
</html>
分享到：
相关推荐
弹出层遮罩层效果(包括居中、不随滚动条滚动)
JS+CSS 实现遮罩居中弹出层（随浏览器窗口滚动条滚动） 本文将详细介绍使用 JS 和 CSS 实现遮罩居中弹出层，并且随浏览器窗口滚动条滚动。该弹出层能够在浏览器窗口中居中显示，且随着浏览器窗口的滚动而滚动。 ...
"CSS实现完美垂直居中"这一主题深入探讨了如何利用CSS技术使元素在容器内实现精确的垂直对齐。以下是一些关于这个主题的关键知识点： 1. **单行文本垂直居中**： 对于单行文本，可以使用`line-height`属性来实现...
总的来说，CSS的`position`属性是实现跟随滚动条漂浮层的关键。通过巧妙地设置`top`、`bottom`、`left`和`right`属性，你可以自由地定制漂浮层在页面上的位置，为用户提供更流畅的浏览体验。在实际项目中，可以结合...
### 滚动条刷新后居中的实现方法 在网页设计与开发中，有时我们希望网页在打开时，滚动条能够自动定位到特定位置，例如居中显示，这对于某些特殊布局（如页面中心为主要展示区域）的情况尤为重要。本文将详细探讨...
在网页设计中，当页面内容超出了可视区域的宽度时，浏览器会自动添加水平滚动条以允许用户水平滚动查看隐藏的内容。然而，滚动条本身会占用一定的空间，这可能会导致页面宽度缩小，从而影响布局的整体美观性。为了不...
在网页设计中，创建一个半透明的全屏蒙层并实现内容绝对居中是一项常见的需求。这主要用于在页面上提供一种交互式的体验，比如显示加载动画、弹出对话框或者遮罩其他元素。下面我们将详细讲解如何使用CSS来实现这个...
本文将深入探讨如何实现"Unity滚动条ScrollView自动居中、缩放、变暗扩展"这一技术。 首先，让我们理解ScrollView的基本工作原理。ScrollView是由Unity的UI系统（Unity UI或UGUI）提供的组件，它允许用户在有限的...
ElementUI 的滚动条组件是用来处理大型数据列表滚动的，它可以自动管理滚动条的显示和隐藏，并提供了许多实用的配置选项来满足不同的需求。在这个例子中，我们使用 ElementUI 的 `el-scrollbar` 组件来实现滚动条的...
总结起来，这个示例展示了如何利用JavaScript和CSS来创建一个随滚动条滚动的居中弹出层和遮罩层。通过调整CSS属性和添加JavaScript事件监听器，可以实现在任何浏览器窗口大小和滚动位置下保持弹出层的居中状态。这个...
标题“弹出层居中”涉及的是网页设计中常见的用户界面元素布局问题，特别是使用JavaScript库如jQuery实现的弹出窗口或对话框的居中显示。在这个场景中，"TestJQueryMaskLayer"可能是一个使用jQuery实现的遮罩层插件...
在网页设计中，"DIV+CSS 图片垂直居中效果"是一个常见的布局需求，它涉及到CSS的盒模型、定位和Flexbox或Grid等现代布局技术。以下是对这一主题的详细阐述： 1. **基础概念** - **DIV**：HTML中的`<div>`元素是一...
在网页设计中，实现元素的垂直居中和水平居中是一项常见的需求，这涉及到CSS布局技术。本篇文章将深入探讨如何使用div+css方法来实现这一目标。在现代Web开发中，div元素作为布局容器广泛使用，而CSS则是样式控制的...
JS+CSS 实现弹出居中背景半透明 div 层的方法 在 Web 开发中，弹出居中背景半透明 div 层是一种常见的交互效果，通过 JavaScript 和 CSS，我们可以轻松实现这种效果。在本文中，我们将详细介绍如何使用 JS+CSS 实现...
标题中的“html+jq+css 自适应屏幕居中”指的是使用HTML、JavaScript（jQuery库）和CSS技术来实现网页元素在不同屏幕尺寸下都能保持居中的功能，特别是针对弹窗的场景。这样的设计有助于提供良好的用户体验，无论...
本篇文章将深入探讨如何利用`DIV+CSS`实现`DIV`的居中布局。 首先，我们要理解`<div>`元素。`<div>`是“division”的缩写，代表一个区域或区块，在HTML中用于组合其他元素，是构建网页布局的基础。通过设置`<div>`...
弹出层（遮罩层）弹出页面垂直居中，一个不错的例子，可拿来使用。
在网页设计中，"DIV+CSS上下左右绝对居中"是一个常见的布局需求，尤其是在构建响应式网站时。这个主题涉及到CSS（层叠样式表）的布局技巧，它可以帮助元素在不同屏幕尺寸下都能保持在容器的中心位置。下面将详细探讨...
### CSS解决未知高度的DIV垂直居中 #### 知识点概述 在Web开发中，实现元素的垂直居中是一项常见的需求。对于已知高度的元素来说，这相对容易实现。但对于那些高度未知或者动态变化的元素，尤其是嵌套在另一个未知...