一、positionfixed

  锁定位置(相对于浏览器的位置),例如有些网站的右下角的弹出窗口。

二、positionabsolute

  1.外层没有position:absolute(或relative);那么div相对于浏览器定位。

  2.外层有position:absolute(或relative);那么div相对于外层边框定位。

三、positionrelative

  相对位置。

把此div包含住的div的某个位置进行固定。如果外层没有包含他的,那就相对于浏览器进行相对位置的固定。

四、分层(z-index

  z轴方向分层,可以理解为分成一摞纸,层数越高越靠上。

五、floatleftright

Leftright时不用给他规定位置(lefttop),直接相对于浏览器。若外部被包裹,相对于外部div的除去一行的位置的左上或右上显示。

  overflow:hidden;    //超出部分隐藏;scroll,显示出滚动条;

半透明效果:

  <div class="box">透明区域<div>

在样式表中的代码为:

.box

{

opacity:0.5; -moz-opacity:0.5 ; filter:alpha(opacity=50)

}

opacity:0;/*为全透明*/

opacity:1;/*为不透明*/

CSS阴影效果(Box-shadow)用法

格式与布局 CSS阴影效果(Box-shadow)用法的更多相关文章

  1. css样式表:样式分类,选择器。样式属性,格式与布局

    样式表分类: 1.内联样式表, 和html联合显示,例:<p style="font-size:14px;">内联样式表</p> 2.内嵌样式表 作为一个独 ...

  2. css样式,边界和边框,格式和布局

    1.大小:width:宽:heigh:高 2.背景:1)background-color:背景颜色 2)background-image:背景图片url路径 3)background-repeat:图 ...

  3. css样式表 格式与布局

    1 样式表  内联样式表  内嵌样式表  外部样式表 2 选择器 标签选择器 <style type="text\css" class 选择器  以.开头 ID选择器 以#开 ...

  4. 关于CSS格式与布局中的基础知识的简单操作

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  5. CSS display:table属性用法- 轻松实现了三栏等高布局

    display:table:此元素会作为块级表格来显示(类似 <table>); display:table-cell属性指让标签元素以表格单元格的形式呈现,类似于td标签.目前IE8+以 ...

  6. css样式表----------样式属性(背景与前景、边界和边框、列表与方块、格式与布局)

    一.背景与前景 (1).背景 line-height: 1.5 !important;">90; /*背景色(以样式表为主,样式表优先.)*/ background-image:url ...

  7. 一个CSS中Z-index的用法

    一个CSS中Z-index的用法 CSS教程:彻底掌握Z-index属性     大多数的CSS属性都很容易使用.常常,当您对标记语言的元素使用CSS属性时,产生的结果会随着您刷新页面而立即呈现.而另 ...

  8. 9月11日上午HTML有序列表、无序列表、网页的格式和布局

    样式表 六.列表方块 1.有序列表变无序列表 <ol> <li>张店</li> <li>桓台</li> <li>淄川</l ...

  9. 一起学HTML基础-格式与布局fixed/absolute/relative/z-index/float

    很多网页都存在一个悬浮的操作条或者广告区,无论如何上下滚动网页,操作条或广告区都不会动,这个就是div制作,位置锁定在屏幕指定位置,现在我们就学习下网页的格式与布局. position 位置,来给di ...

随机推荐

  1. TCP通讯程序设计

    TCP通讯程序设计 这里主要包含客户机和服务器的编程. 一.编程模型函数化 使用函数说明:socket的理解 服务器: 创建socket使用函数----->socket 绑定地址使用函数---- ...

  2. 提升 LaTeX 效率的小工具:Detexify LaTeX handwritten symbol recognition

    Detexify LaTeX handwritten symbol recognition 用 LaTeX 的人找符号的表示方法通常很费事,需要去翻长长的列表.Detexify 是一个省事的小网站,只 ...

  3. Android图像处理实例教程

    Android图像处理实例教程 原始出处 http://vaero.blog.51cto.com/4350852/856750

  4. 【java基础】内存分析

    在上次我们说的<重载与重写>呢,我们遗留了一个问题,就是运行结果的各异性,那今天,我们就来探究一下         内存里的天地.                  首先呢,我们把mian ...

  5. 如何hash一条有向边

    之前这个问题还困扰了我好久,但是现在我才明白这个很蠢的问题 那就是(3,7)(4,9)(3,3)这种有向序点对(括号可能用的不对) 我们可以变成对"(3,7)"字符串的hash,当 ...

  6. Liferay 6.2 改造系列之七:关闭使用条款确认、密码提醒、新用户强制修改密码等功能

    关闭使用条款确认: 在/portal-master/portal-impl/src/portal.properties配置文件中,有如下配置: # # Set this to true if all ...

  7. [技术学习]js接口继承

    js是面向对象语言,但是js又缺乏了面向对象的诸多特性,比如继承,没有接口继承也没有父类继承,因此有时候需要人工来实现继承. 一.首先看下java中面向对象的继承: //定义类鸟类的飞行动作 inte ...

  8. [xsd学习]xsd基本要素

    一.xsd常用数据格式 xs:string xs:decimal xs:integer xs:boolean xs:date xs:time 二.简易元素 <xs:element name=&q ...

  9. 关于oracle ORA-28001的解决方法

    今天发现客户的机器上的系统登录不上了,并且提示如下情况: 发现原来Oracle11G的新特性所致, Oracle11G创建用户时缺省密码过期限制是180天(即6个月), 如果超过180天用户密码未做修 ...

  10. Delphi 2009 泛型容器单元(Generics.Collections)[1]: TList<T>

    Delphi 2009 新增了泛型容器单元: Generics.Collections, 同时还有一个 Generics.Defaults 单元做支持. Generics.Collections 包含 ...