鱼C论坛

 找回密码
 立即注册
查看: 4477|回复: 10

[奇技淫巧] 如何快速修改背景色 & 添加背景图

[复制链接]
发表于 2017-1-20 08:28:20 | 显示全部楼层 |阅读模式

马上注册,结交更多好友,享用更多功能^_^

您需要 登录 才可以下载或查看,没有账号?立即注册

x
本帖最后由 不二如是 于 2020-3-17 19:11 编辑

04,我们第一次利用body,URL加载本地图片。

25,我通过C3方式,加载图片。

现在可以分享一个,更简单的加载方式,先看下代码:
<!DOCTYPE html>
<html>
<head>
        <title>基本框架</title>
</head>
<body bgcolor="#F33" background="FishC.png">

</body>
</html>
效果图:
Snip20170120_183.png


没错,直接在<body>标签,用bgcolor修改背景色,background加载背景图。

唯一的硬伤,就是结构很混乱!

慎用,仅作分享看~

最尬的地方,还是需要C3,来取消背景图的平铺:
   body{
                        background: url(FishC.png)center center;
                        background-repeat:no-repeat        
                }

所以还是建议使用<img>标签!!!
<img src="">


这位鱼油,如果喜欢本系列HTML帖子,请订阅 专辑&#9758;传送门)(不喜欢更要订阅

评分

参与人数 3荣誉 +5 鱼币 +5 贡献 +9 收起 理由
微末非末 + 5 + 5 + 3 感谢楼主无私奉献!
睦ちゃん她爹 + 3 感谢楼主无私奉献!
alltolove + 3 感谢楼主无私奉献!

查看全部评分

想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复

使用道具 举报

发表于 2017-1-20 09:00:46 | 显示全部楼层
这么点内容正好适合我理解
想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

 楼主| 发表于 2017-1-20 09:19:24 | 显示全部楼层
alltolove 发表于 2017-1-20 09:00
这么点内容正好适合我理解

哈哈,前面的也很简单~

有不会的发帖或者留言,看到第一时间回复~
想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复 支持 1 反对 0

使用道具 举报

发表于 2017-1-20 09:26:59 | 显示全部楼层
新手过来抚摸楼主
想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

 楼主| 发表于 2017-1-20 09:32:33 | 显示全部楼层
n9vakin 发表于 2017-1-20 09:26
新手过来抚摸楼主

谢谢抚摸~

送一块小皂皂给你
想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

发表于 2017-4-25 10:05:22 | 显示全部楼层

新手过来抚摸楼主
想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

发表于 2018-6-6 21:42:48 | 显示全部楼层
<!DOCTYPE html>
<html>
<head>
        <title>基本框架</title>
                <style type="text/css">
                        body{
                                background: url(fishc.png) center 0;
                                background-repeat:no-repeat;
                        }
                         
                </style>
</head>
<body>
        
</body>
</html>
20180606214019270.png
想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

发表于 2018-6-9 14:48:06 | 显示全部楼层
<!DOCTYPE html>
<html>
<head>
        <meta charset="utf-8">
        <title>Tips0</title>
        <style type="text/css">
        body{
                background:url(FishC.png) center 0;
                background-repeat:no-repeat;
        }
        </style>
</head>
<body bgcolor="#F33" background="FishC.png">
        <!--已用CSS,快速加入背景圖就沒效果啦-->
</body>
</html>

Tips0.jpg

想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

发表于 2018-10-20 08:11:09 | 显示全部楼层
<!DOCTYPE html>
<html>

<head>
    <title>基本框架</title>
    <style>
        body {
            background: url(FishC.jpg) center 0;
            background-repeat: no-repeat;
        }
    </style>
</head>

<body bgcolor="#F33" background="FishC.jpg">

</body>

</html>
想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

发表于 2020-8-18 20:18:28 | 显示全部楼层
无条件支持楼主!
想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

发表于 2022-5-22 22:17:52 | 显示全部楼层
我怎么像小甲鱼那样可以设置多个可点击改变的body背景图!
想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

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

本版积分规则

小黑屋|手机版|Archiver|鱼C工作室 ( 粤ICP备18085999号-1 | 粤公网安备 44051102000585号)

GMT+8, 2024-11-22 13:05

Powered by Discuz! X3.4

© 2001-2023 Discuz! Team.

快速回复 返回顶部 返回列表