当前位置：首页 → 问答吧 → 一道CSS面试题，到现在还是没弄明白。。。。。。

一道CSS面试题，到现在还是没弄明白。。。。。。

时间：2011-04-27

来源：互联网

下面是左右侧的阴影图片，高人指点下

附件

未标题-1.gif (36.25 KB)

2011-4-27 23:23

l_shadow.png (130 Bytes)

2011-4-27 23:23

r_shadow.png (129 Bytes)

2011-4-27 23:23

作者: teng315 发布时间: 2011-04-27

宽度自适应的话可以把北京和中间的主内容区域放在一个大的容器下了

作者: yjlrwmqj 发布时间: 2011-04-28

左侧宽度10%中间80%右侧10%

然后高度100% 呵呵不知道对不对

作者: cncity100 发布时间: 2011-04-28

<!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <title>无标题文档</title> <style> .main{ position:relative;width:80%;padding:0 7px;} .main .left, .main .right{position:absolute;top:0;width:7px;height:100%;background-repeat:repeat-y;background-color:#090;} .main .left{left:0;background-image:url(l_shadow.png);} .main .right{right:0;background-image:url(r_shadow.png);} .main .info{background:#CDFEBC;} </style>  </head> <body> <div class="main"> <div class="left"></div> <div class="right"></div> <div class="info"> <p>主内容区域</p> </div> </div> <div class="main"> <div class="left"></div> <div class="right"></div> <div class="info"> <p>主内容区域</p> <p>主内容区域</p> <p>主内容区域</p> <p>主内容区域</p> <p>主内容区域</p> <p>主内容区域</p> <p>主内容区域</p> <p>主内容区域</p> <p>主内容区域</p> <p>主内容区域</p> <p>主内容区域</p> <p>主内容区域</p> <p>主内容区域</p> <p>主内容区域</p> <p>主内容区域</p> <p>主内容区域</p> </div> </div> </body> </html>
提示：您可以先修改部分代码再运行

作者: jkli 发布时间: 2011-04-28

一道CSS面试题，到现在还是没弄明白。。。。。。

附件

热门阅读

热门下载