挂两个灯笼在上方左右角

马黑黑

祝大家新春快乐万事如意财源滚滚来！

马黑黑

代码其实很简单：

1. <style type="text/css">
   
2. 
   
3. .papa { position: relative;}
   
4. .denglong1, .denglong2 {
   
5.         position: fixed;
   
6.         width: 200px;
   
7.         height: 200px;
   
8.         opacity: 0.5;
   
9. }
   
10. .denglong1 { left: 0; top: 0; }
    
11. .denglong2 { left: calc(100vw - 200px); top: 0; }
    
12. 
    
13. </style>
    
14. <div class="papa">
    
15.     <img class="denglong1"  src="https://www.huachaowang.com/data/attachment/forum/202201/23/144742dpfezemfeyjylm4y.jpg" alt="" />
    
16.     <img class="denglong2" src="https://www.huachaowang.com/data/attachment/forum/202201/23/144742dpfezemfeyjylm4y.jpg" alt="" />
    
17.     <p>祝大家新春快乐万事如意财源滚滚来！</p>
    
18. </div>

复制代码

马黑黑

但是页面被入侵了

马黑黑

图片底部不透明

马黑黑

挂实图要挂个底部透明的才行
实图不能直接挂，要用一个 div 装载，否则会搞乱网页布局

红影

马黑黑 发表于 2022-1-23 17:59
挂实图要挂个底部透明的才行
实图不能直接挂，要用一个 div 装载，否则会搞乱网页布局

挂透明的就行了啊

                               
登录/注册后可看大图

马黑黑

红影 发表于 2022-1-23 19:48
挂透明的就行了啊

你去开个帖子试下

红影

这个代码倒是简洁，直接把两个命令写一起了，只不过分别定位

马黑黑

红影 发表于 2022-1-23 19:54
这个代码倒是简洁，直接把两个命令写一起了，只不过分别定位

相同属性值的部分可以合起来写，这样节省点劳力

红影

马黑黑 发表于 2022-1-23 19:52
你去开个帖子试下

我更想去做个你前面那个会动的灯笼啊

红影

马黑黑 发表于 2022-1-23 20:08
相同属性值的部分可以合起来写，这样节省点劳力

聪明的做法，还可以这样，没想到。

马黑黑

红影 发表于 2022-1-23 21:30
聪明的做法，还可以这样，没想到。

看多了，用多了，就会的

马黑黑

红影 发表于 2022-1-23 21:30
我更想去做个你前面那个会动的灯笼啊

那个也不难，就是多个div嵌套

红影

马黑黑 发表于 2022-1-23 21:36
看多了，用多了，就会的

在黑黑的帖子里涨知识了

红影

马黑黑 发表于 2022-1-23 21:37
那个也不难，就是多个div嵌套

想加的底图上去，对我来说就有点难

马黑黑

红影 发表于 2022-1-23 22:32
想加的底图上去，对我来说就有点难

那个纯CSS灯笼就能加两个字

马黑黑

红影 发表于 2022-1-23 22:32
在黑黑的帖子里涨知识了

也许是好事吧

红影

马黑黑 发表于 2022-1-23 23:39
那个纯CSS灯笼就能加两个字

不是加灯笼里，是加背景底图啊

红影

马黑黑 发表于 2022-1-23 23:39
也许是好事吧

肯定是好事啊，每天看着代码，一点点熟悉它们。

马黑黑

红影 发表于 2022-1-24 12:04
肯定是好事啊，每天看着代码，一点点熟悉它们。

甚好甚好