<html>

<head>

<title>javascript</title>

<style type="text/css">

div.window{

    position: absolute;

    width: 300px;height:200px;

    border: 3px outset gray;

}

div.titlebar{

    position:absolute;

    top:0px;height:18px;

    width:290px;

    background-color:#aaa;

    border-bottom:groove gray 2px;

    padding:3px 5px 2px 5px;

    font:bold 11pt sans-serif;

}

div.content{

    position:absolute;

    top:25px;

    height:165px;

    width:290;

    padding:5px;

    overflow:auto;

    background-color:#fff;

}

div.translucent{

    opacity:.75;

    filter:alpha(opacity=75);

}

</style>

<head>

<body>

<div class="window" style="left: 10px;top: 10px; z-index:10;">

<div class="titlebar">Test Window</div>

<div>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br><br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br></div>

</div>

<div class="window" style="left: 75px;top: 110px; z-index:20;">

<div class="titlebar">Anther window</div>

<div class="content translucent" style="background-color:#ccc; font-weight:bold;">

this is another window. its <tt>z-index</tt>puts it on top of the other one css

styles mke its content area translucent,in browsers that support that

</div>

</div>

<body>

</html>

css四可见,部分可见和重叠半透明的更多相关文章

  1. CSS四种定位及应用

    定位(position) 如果,说浮动, 关键在一个 “浮” 字上面, 那么 我们的定位,关键在于一个 “位” 上. PS: 定位是我们CSS算是数一数二难点的了,但是,你务必要学好它,我们CSS离不 ...

  2. CSS外边距margin上下元素重叠

    CSS外边距margin上下元素重叠 转载:http://www.gaoyouyou.com/view/77.htm 两个或多个块级盒子的垂直相邻边界会重合.结果的边界宽度是相邻边界宽度中最大的值.如 ...

  3. 前端基础----CSS语法、CSS四种引入方式、CSS选择器、CSS属性操作

    一.CSS语法 CSS 规则由两个主要的部分构成:选择器,以及一条或多条声明. 例如: h1 {color:red; font-size:14px;} 二.CSS四种引入方式 1,行内式 行内式是在标 ...

  4. CSS 四种引入样式表优缺点分析

    CSS 四种引入样式表 CSS 有四种方式引入样式表,如下: 外部样式表 内部样式表 行内样式表 导入样式表 外部样式表优缺点 优点 实现了结构与表现的代码完全分离 方便复用及维护 因为分离到各自独立 ...

  5. css四种选择器总结

    css 在网页开发中扮演着重要的角色,被誉为网页开发的三剑客,如果说html是人的外在器官部分,那css无疑是各个器官组成在一起然后表现出来,css又称样式重叠在网页排版布局中的地位举足轻重.   做 ...

  6. 利用Js或Css滤镜实现IE6中PNG图片半透明效果 IE6PNG妥妥的

    接下来介绍几种PNG图片在IE6中不透明的解决办法 1.用自己的PNG,让IE6一边去吧 首先制作PNG图片的时候,另存为一个GIF图片,因为IE6是支持GIF图片透明,然后在css定义 .pngte ...

  7. [css 揭秘]：CSS揭秘 技巧（一）：半透明边框

    我的github地址:https://github.com/FannieGirl/ifannie/ 源码都在上面哦 喜欢的给我一个星吧 半透明边框 css 中的半透明颜色,比如用 rgba() 和 h ...

  8. css中margin上下外边距重叠问题

    css的盒子模型里是这样规定两个对象之间的距离的:对象之间的间距是由两个对象的盒子模型的最终计算值得出来的,也就是说两个对象之间的间距就是两个对象的距离,但是当遇到两个对象一个有下外边距margin, ...

  9. css四种定位

    概述:元素定位属性主要包括的模式和边偏移两部分,也就是说以后定位要和边偏移量搭配使用.边偏移加定位定位模式才能构成一个完整的定义方式. 偏移量说明: 边偏移属性 描述 top: 顶端偏移,定义元素相对 ...

随机推荐

  1. 数据展示Matplotlib

    主要内容是Matplotlib库的基本使用和方法 1 Matplotlib库 1.1 Matplotlib的介绍 Python优秀的数据可视化第三方库 数据可视化就是将数据以特定的图形图像的方式展示出 ...

  2. 在ubuntu16.04上安装php7 mysql5.7 nginx1.10并支持http2

    安装nginx 首先更新软件包 并且安装nginx sudo apt-get update sudo apt-get install nginx 开放防火墙配置 sudo ufw allow 'Ngi ...

  3. RedHat Server Enterprise 6安装G++

    RedHat 6默认是安装有GCC,而没有安装G++编译 要安装G++前最好先查看下GCC的版本号,通常GCC的版本和G++的版本是相同的,知道GCC的版本再去找G++的安装文件就容易些,版本号有在安 ...

  4. Windows下Python安装lxml

    1.下载easy_install的安装包,下载地址:https://pypi.Python.org/pypi/setuptools 我是Windows7,所以直接下载Windows(Simplify) ...

  5. 数据结构（栈&堆 ）

    在计算机领域,堆栈是一个不容忽视的概念,堆栈是两种数据结构.堆栈都是一种数据项按序排列的数据结构,只能在一端(称为栈顶(top))对数据项进行插入和删除.在单片机应用中,堆栈是个特殊的存储区,主要功能 ...

  6. RESTful 服务示例

    WCF服务轻量级服务,可供JS调用 返回值格式:XML.Json 工程结构: 示例代码: using System; using System.Collections.Generic; using S ...

  7. 关于fft后图像的纵轴问题

    fft后如果纵轴是abs后的值,且为双边图像,那么纵轴表示的就是此频率下信号的幅值*N/2的值,也就是说,如果有一正弦信号,幅度为1,假如fft了50个点,那么此信号频率的幅度就是1*50/2=25. ...

  8. 老罗关于binder的链接

    Android进程间通信(IPC)机制Binder简要介绍和学习计划 : http://blog.csdn.net/luoshengyang/article/details/6618363

  9. 限制UITextfield的输入字符为50个字符

    1.实现UITextfieldDelegate 2.在UITextfield的代理方法中判断添加字符还是删除字符,从而做不同的操作 #pragma mark-UITextfield的代理方法 - (B ...

  10. Oracle 13c OEM 安装手册

    1       安装准备工作 以下包已Redhat 为准,其他版的操作系统以官方手册为准. 1.1         Oracle Management Service 依赖如下包 glibc-comm ...