请选择 进入手机版 | 继续访问电脑版
查看: 4567|回复: 11

[求助] 请教图片效果问题:做如东方财富网首页顶部图片效果

[复制链接]

3

主题

7

回帖

12

积分

初学乍练

贡献
0 点
金币
0 个
发表于 2021-7-1 11:40:43 | 显示全部楼层 |阅读模式
请教一个图片效果问题:做如东方财富网首页顶部图片效果和弹出可收缩广告图   ( https://www.eastmoney.com )
已找到样式代码但不知道放在论坛那个文件上可以做出这样效果,请教各位大侠

<style type="text/css">
        .baokuang{height:800px;width:100%;background:url(//g1.dfcfw.com/g4/202106/20210623175012.png) repeat-x 0 0 #FFF;}
        .baokuang .bkImg,.baokuang .bkImg .cImgDiv {background:url(//g1.dfcfw.com/g4/202106/20210623182133.png) no-repeat center top;}
        .baokuang .bkImg {width:100%; height:800px;margin:0 auto;}
        .baokuang .bkImg .cImgDiv{width:1000px; height:40px; margin:0 auto; position:relative;}
        .baokuang .bkImg .clickMap { display:block; height:40px; width:100%; text-indent:-100em; overflow:hidden;}
        .baokuang .bkImg .close{background:url(//g1.dfcfw.com/g4/202106/20210623120249.png) no-repeat;width:44px; height:18px;cursor:pointer; position:absolute; right:0px; bottom:20px; text-indent:-100em; overflow:hidden;}
        .pageCont { background:#FFF; height:0; overflow:hidden; margin-top:-760px;}
        .top-advert{margin-top:0; padding-top: 0;}
        .emfloat_wrapper{margin-top:30px;}
        </style>
    </head>

<body>
        <div id="baokuangBox" class="baokuang">
            <div class="bkImg">
                <div class="cImgDiv">
                        <a class="clickMap" >&nbsp;</a>
                    <span class="close">关闭</span>
                </div>
            </div>
        </div>
        <div id="pageCont" class="pageCont"></div>
我知道答案 回答被采纳将会获得1 贡献 已有11人回答
回复

使用道具 举报

3

主题

7

回帖

12

积分

初学乍练

贡献
0 点
金币
0 个
 楼主| 发表于 2021-7-1 14:41:57 | 显示全部楼层
如首页顶部这个图片不知放在论坛什么文件上
20210623182133.png
回复 支持 反对

使用道具 举报

5

主题

419

回帖

628

积分

应用开发者

Discuz! 运维技术

贡献
3 点
金币
143 个
QQ
发表于 2021-7-1 15:42:33 | 显示全部楼层
一般放在头部
回复 支持 反对

使用道具 举报

3

主题

7

回帖

12

积分

初学乍练

贡献
0 点
金币
0 个
 楼主| 发表于 2021-7-1 20:03:01 | 显示全部楼层
试过放在header.htm文件中,但没效果
回复 支持 反对

使用道具 举报

83

主题

2795

回帖

3502

积分

功行圆满

贡献
10 点
金币
351 个
发表于 2021-7-2 02:09:31 | 显示全部楼层
oliver 发表于 2021-7-1 11:03
试过放在header.htm文件中,但没效果

你的没效果是什么意思?
回复 支持 反对

使用道具 举报

83

主题

2795

回帖

3502

积分

功行圆满

贡献
10 点
金币
351 个
发表于 2021-7-2 05:05:42 | 显示全部楼层
东方财富网首页顶部图片

02.JPG
回复 支持 反对

使用道具 举报

3

主题

7

回帖

12

积分

初学乍练

贡献
0 点
金币
0 个
 楼主| 发表于 2021-7-2 12:51:28 | 显示全部楼层
把以下代复制到header.htm文件中,在论坛首页没显示图片
注:图片和路径已改为自己网地址
<style type="text/css">
        .baokuang{height:800px;width:100%;background:url(//g1.dfcfw.com/g4/202106/20210623175012.png) repeat-x 0 0 #FFF;}
        .baokuang .bkImg,.baokuang .bkImg .cImgDiv {background:url(//g1.dfcfw.com/g4/202106/20210623182133.png) no-repeat center top;}
        .baokuang .bkImg {width:100%; height:800px;margin:0 auto;}
        .baokuang .bkImg .cImgDiv{width:1000px; height:40px; margin:0 auto; position:relative;}
        .baokuang .bkImg .clickMap { display:block; height:40px; width:100%; text-indent:-100em; overflow:hidden;}
        .baokuang .bkImg .close{background:url(//g1.dfcfw.com/g4/202106/20210623120249.png) no-repeat;width:44px; height:18px;cursor:pointer; position:absolute; right:0px; bottom:20px; text-indent:-100em; overflow:hidden;}
        .pageCont { background:#FFF; height:0; overflow:hidden; margin-top:-760px;}
        .top-advert{margin-top:0; padding-top: 0;}
        .emfloat_wrapper{margin-top:30px;}
        </style>
回复 支持 反对

使用道具 举报

83

主题

2795

回帖

3502

积分

功行圆满

贡献
10 点
金币
351 个
发表于 2021-7-2 17:40:54 | 显示全部楼层
东方财富网首页顶部图片先下载到本地;将图片传到服务器对应的目录里,覆盖,更新缓存即可
回复 支持 反对

使用道具 举报

3

主题

7

回帖

12

积分

初学乍练

贡献
0 点
金币
0 个
 楼主| 发表于 2021-7-2 20:10:26 | 显示全部楼层
是这样做的,但图片不显示,没效果
回复 支持 反对

使用道具 举报

83

主题

2795

回帖

3502

积分

功行圆满

贡献
10 点
金币
351 个
发表于 2021-7-2 21:22:34 | 显示全部楼层
oliver 发表于 2021-7-2 11:10
是这样做的,但图片不显示,没效果

图片只支持窄版;若用第三方模版,背景图片要放到第三方模版的同样位置。
回复 支持 反对

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则