CSS相对定位实现DIV层的投影(阴影)效果

<html>

<head>

<title>DIV层阴影</title>

<style>

.out {

position:relative;

background:#E4E4E4;

margin:8px auto;

width:300px

}

.in {

background:#fff;

border:1px solid #666;

padding:10px 5px;

position:relative;

top:-5px;

left:-5px;

}

</style>

</head>

<body>

<div class="in" >CSS相对采用相对定位实现DIV层的投影(阴影)效果</div>

</div>

<div><A href="http://www.999jiujiu.com/">http://www.999jiujiu.com/</A></div>

</body>

</html>

时间： 2024-10-12 17:39:48

CSS相对定位实现DIV层的投影(阴影)效果的相关文章

CSS 如何使DIV层水平居中

今天用CSS碰到个很棘手的问题,DIV本身没有定义自己居中的属性, 网上很多的方法都是介绍用上级的text-align: center然后嵌套一层DIV来解决问题. 可是事实上这样的方法科学吗? 经过网络搜索和亲自实验得出以下结论: 正确的也是对页面构造没有影响的设置如下: 对需要水平居中的DIV层添加以下属性: margin-left: auto; margin-right: auto; 经过这么一番设置问题似乎解决了,在FF中已经居中了,可是在IE中看竟然还是没有居中! 郁闷了一下午,就是找

CSS实现半透明div层的方法

<html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>半透明div</title> <style> #div1 { margin:0px auto; width:500px;

div+css相对定位和绝对定位

今天突然发现自己在布局的时候思路很乱,于是毅然决然的想要重新的理一下自己的布局思路,今天就先从定位开始吧~ 绝对定位(absolute):将被赋予此定位方法的对象从文档流中拖出,如果对象的父级没有设置定位属性,则依据body对象左上角作为参考进行定位.绝对定位对象可层叠,层叠顺序可通过z-index属性控制,z-index值为无单位的整数,大的在最上面,可以有负值(目前负值FF不支持). 同时z-index仅能在定位元素上奏效!!! 相对定位(relative):对象不可层叠,依据left,ri

页面固定DIV层CSS代码

有时候为了用户体验更好些,网页设计师会把网站导航放在一个固定的DIV层里面,不随滚动条滚动.本方法是利用CSS,position:fixed属性来固定层,fixed是特殊的absolute,即fixed总是以body为定位对象的,按照浏览器的窗口进行定位.这样网站导航布局好看些,以下是实现的一种方法: #box { height:45px;/*高度*/ background:#488fce;/*背景颜色*/ width:100%;/*宽度*/ position:fixed;/*固定层*/ top

CSS+JS实现的div层定位功能和自动消失

CSS顶部固定功能,有空的时候研究了一下CSS的定位功能,做了这个大家熟悉的顶部固定功能,鼠标移上去顶部会消失,并可判断浏览器是否支持audio元素!顶部元素在时间控制下也可自动消失. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns

div浮动层与div层有何不同css中有什么关系

首先DIV浮动层与DIV层都是指DIV布局,体感音乐一般使用CSS样式表加DIV标签组合进行布局网页. div层一般包括div浮动层,div浮动层说明div被加入css浮动样式所以被称为div浮动层,而没有加入float浮动样式不具有浮动效果,所以如果没有被加浮动样式div不被称为浮动层.当然span.h1.ul.li等标签也是层,只不过span.h1.ul.li等标签没有div使用频率高,所以一般就将div作为象征性称呼. 接下来DIVCSS5通过实例告诉大家什么是一般层,什么是浮动层?为什么

利用css如何让嵌套的div层不继承父div层的透明度？

http://zhidao.baidu.com/link?url=cvQhh0Q7_ah0qg9tc-2zP0cjB_PoIiIq6t6RFpp4aZPPNoVJUqyy7TT41TU5pWzRtRYIMNCkdMkAV36oR-RraFyyghs__ULNjlNiOGgkYOC 利用css如何让嵌套的div层不继承父div层的透明度? http://blog.csdn.net/foart/article/details/39177653 DIV浮在上层并让DIV背景半透明代码 http://x

CSS制作斜角上有背景图片的Div层

<html> <head> <title>CSS制作斜角上有背景图片的Div层</title> <style> .window{ width:400px; border:1px solid #B6B6C0; position:relative; } .title{ background:#F0F0F2; height:30px; border-bottom:1px solid #CBCFD2; font-size:14px; line-heigh

CSS设置div层充满整个网页

div的100%是从其上一级div的宽高继承来的,要设置div100%显示,必须设置其上一级div的宽度或高度,否则无效. 前面总得有个容器说明他的高度是多少.这样的话div才能按比例100%继承上一级的高度可惜的是浏览器一般默认解释为内容的高度,而不是100%. 解决方法:只要为html和body设置高度为100%就可以了html,body{height:100%;}这样之后div会按比例来继承上一级的高度了.仅仅设置的DIV元素的height属性貌似没有什么效果. 1 html, body{