<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> Test </TITLE>
<style type="text/css">
<!--
html,body {
height:100%; margin: 0px; font-size: 12px;
font-family: FixedSys;
}
.mydiv {
background-color: lightblue; border: 1px solid blue;
text-align: center;
line-height: 20px;
font-size: 12px;
font-weight: bold;
z-index: 999;
width: 200px;
height: 120px;
left: 50%;
top: 50%;
margin-left: 150px!important;
margin-top: -60px!important;
margin-top: 0px;
position: fixed!important;
position: absolute;
}
.bg,.popIframe {
background-color: #666; display: none;
width: 100%;
height: 100%;
left: 0;
top: 0;
filter: apha(opacity=50);
opacity: 0.5;
z-index: 1;
position:fixed!important;
position: absolute;
}
.popIframe {
filter: alpha(opacity=0);
opacity:0;
}
-->
</style>
<SCRIPT LANGUAGE="JavaScript">
<!--
function showDiv() {
document.getElementById('popDiv').style.display = 'block';
document.getElementById('popIframe').style.display = 'block';
document.getElementById('bg').style.display = 'block';
}
function closeDiv() {
document.getElementById('popDiv').style.display = 'none';
document.getElementById('popIframe').style.display = 'none';
document.getElementById('bg').style.display = 'none';
}
//-->
</SCRIPT>
</HEAD>
<BODY>
<div class="mydiv" id='popDiv' style="display: none">
Hello world!<br/>
<a href="javascript:closeDiv();">Close Div</a></div>
<div id="bg" class="bg" style="display: none;"></div>
<a href="javascript:showDiv();">Show Div<//a>
<iframe id="popIframe" class="popIframe" frameborder="0"></iframe>
</BODY>
</HTML>
分享到：
相关推荐
【CSS和Div+CSS布局详解】 CSS（Cascading Style Sheets）是一种用于描述HTML或XML（包括如SVG、MathML等各种XML方言）文档样式的样式表语言。在网页设计中，`div+css`布局是一种常见的网页布局方式，它将结构...
【CSS和Div+CSS简介】 CSS（Cascading Style Sheets）是一种用于描述HTML或XML（包括如SVG、MathML等各种XML方言）文档样式的样式表语言。它允许我们将样式信息与结构信息分离，使得网页设计更为灵活且易于维护。...
### DIV+CSS与JavaScript的结合运用 #### 一、引言 随着互联网技术的飞速发展，网页设计已经成为人们日常生活中不可或缺的一部分。在这一领域内，DIV+CSS 和 JavaScript 成为了构建高质量、交互性强的网页的重要...
《div+css别具光芒教程1》是一套由知名作者Vicky推出的高质量教程，旨在深入浅出地教授读者如何利用HTML中的div元素和CSS样式语言，构建美观且功能强大的网页布局。这个教程不仅包含了基础的HTML和CSS概念，还特别...
在网页设计领域，`DIV+CSS`是一种广泛使用的布局技术，它通过HTML的`<div>`元素配合CSS（层叠样式表）实现页面的结构化和美化。这种布局方式能够提高网页的可维护性、可扩展性和性能。下面将详细阐述`DIV+CSS`完美...
2. **IE6的CSS兼容性问题**：IE6不支持一些CSS2.1标准，如：伪类选择器（:hover, :first-child等），透明度（opacity），以及浮动元素的清除（clear）等。这导致基于现代CSS设计的页面在IE6上显示不正常。 3. **...
以下是一些`div+css`共用的属性及其详细解释： 1. `font-size`: 这个属性用于设置字体大小，如`.small`设置了最小字体为9px，`.large`设置了最大字体为18px。 2. `margin`: 定义元素周围的外边距，如`.small`和`....
DIV+CSS布局方法是现代网页设计中不可或缺的一部分，它极大地改善了网页的可维护性和可扩展性。在传统的HTML布局中，表格经常被用来控制页面元素的位置，但这种方式往往导致代码冗余，不利于搜索引擎优化（SEO），...
### DIV+CSS初学者必知知识点详解 #### 一、DIV+CSS概述 - **定义**：DIV+CSS是Web标准中的一个重要组成部分，它代表了一种网页布局的方法，不同于传统的HTML表格定位技术，通过DIV+CSS可以实现内容与表现的完全...
【div+css 教程】 在网页设计领域，`div`和`CSS`（层叠样式表）是构建网页布局的基础元素。`div`（division）是一个HTML标签，用于将内容分组，而CSS则是用来描述这些内容如何在屏幕上显示的关键技术。本教程将深入...
通过 CSS，我们可以对 div 进行样式设置，以实现复杂的页面布局。例如： ```html <div>hello world</div> ``` 这个 div 只是一个区块，它不会改变内部文本的样式。如果想要改变文字样式，需要借助 CSS。 **CSS**： ...
5. **CSS伪类和边框样式**：`first`、`last`、`dashed`、`inner`、`outer`等是CSS中的伪类或边框样式，用于定制元素的特定状态或样式。 6. **解决IE中列表高度显示问题**：在IE6中，可以通过`*...
在网页设计中，`DIV+CSS`是一种常用的技术，它能够实现页面的结构与样式分离，提高网页的可维护性和可扩展性。然而，不同浏览器对CSS的支持程度并不完全一致，尤其是在IE6、IE7和Firefox（FF）之间，存在诸多兼容性...
在网页设计中，`div` 和 `css` 是构建页面布局和样式的重要工具。`div` 元素作为块级元素，常用于组织和划分页面结构，而 `css` 则用于定义这些元素的样式、位置和交互效果。在本教程中，我们将详细探讨如何使用 `...
《Dreamweaver8系列DIV+CSS教程超链接伪类》 在网页设计中，超链接是不可或缺的一部分，它使得互联网的各个页面能够相互连接，构建起丰富的信息网络。本教程主要探讨了超链接的四种样式及其伪类，以及如何利用CSS...
在网页设计和开发中，`DIV+CSS`是一种常见的布局技术，它通过CSS（层叠样式表）来控制HTML元素，如`DIV`，以实现页面的精确布局和美化。以下是一些核心的CSS属性及其用途： 1. **Line-height** (行距): 这个属性...
css文件 */ body { margin: 0px; padding: 0px; background: #FFFFFF url(images/bg01.jpg) repeat left top; font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; font-size: 13px; color: #797979; } h1,...
例如，给第一列的`div`添加一个特殊的类 `.first-column`，然后设置它的`margin-left: 0`，而其他列则使用默认的`margin-left`。 在实际应用中，可能还需要考虑响应式设计，使布局在不同屏幕尺寸下都能良好展示。...
- **段首字符下沉与大写**：使用`::first-letter`伪元素。 - **文本的对齐**：使用`text-align`属性。 - **图文混排**：处理文本和图像的排列方式。 #### 行高与间隔 - **行高属性详解**：通过`line-height`属性...
根据提供的文件信息，标题与描述均为“别具光芒DIV+网页布局CSS与美化.pdf 高清下载”，且标签为“CSS”。尽管这部分内容反复提到了一个Java学习社区的链接，但与标题和描述中的主题——DIV+CSS网页布局与美化并不...