如何添加图片作为网站背景?

原创 暗潮  2018-08-10 09:19:04  阅读 1296 次 评论 4 条

网页添加背景图片的功能其实非常简单,这里分享两种方式:一种是添加自定义的图片作为背景、另一种是添加bing的每日图片作为背景。

第一种添加自定义的图片作为背景,只需要添加如下代码到header文件的</head>标签内:

<style>body {background-image: url("图片地址,本博客使用的是{$host}zb_users/theme/{$theme}/image/background.png");background-position:left top;background-size:auto;background-repeat:repeat;background-attachment:scroll;}</style>

第二种添加bing的每日图片作为背景,需要如下几步即可实现:

(1)使用 notepad++ 或者其他专业的网页编辑器新建一个包含以下内容的 php 文件,如命名为 bing.php 文件。

<?php

$str=file_get_contents('http://cn.bing.com/HPImageArchive.aspx?idx=0&n=1');

if(preg_match("/<url>(.+?)<\/url>/ies",$str,$matches)){

$imgurl='http://cn.bing.com'.$matches[1];

}

if($imgurl){

header('Content-Type: image/JPEG');

@ob_end_clean();

@readfile($imgurl);

@flush(); @ob_flush();

exit();

}else{

exit('error');

}

?>

(2)保存上传到网站根目录(或者其他地方,在第三步中填写正确的 bing.php 文件路径即可),然后访问 bing.php 文件,你就会发现已经是一张 bing 的每日图片了。这个 bing.php 文件会通过 php 将图片转换为 jepg 格式,也就是说,bing.php 虽然说是一个 php 文件,但实际上它就是一个 jepg 文件,你可以通过 <img src="bing.php"> 这个代码来展现图片。

(3)打开网站的 header.php 之类的文件,在 </head> 标签内添加以下代码:

<style>body {background-image: url("bing.php 的地址");filter:"progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod='scale')";-moz-background-size:100% 100%;background-size:100% 100%;background-attachment: fixed;}</style>

至此,刷新网站之后就能看到 bing 的每日图片了。


这两种方法其实都是一样的,只是一个方法应用的指定图片、另一种方法是引用bing的每日图片,对了该方法适合所有使用 PHP 建站的网站哦。

(参考了boke112导航:https://boke112.com/bkwd/4589.html)

本文地址:http://www.wu2007.cn/post/694.html
版权声明:本文为原创文章,版权归 暗潮 所有,欢迎分享本文,转载请保留出处!
【版权声明】本站部分文章来自网络,欢迎转载本人原创文章、图片,请提供本博客中相应文章的链接。
请勿将原创图片、文章用于商业用途!对于给您带来的不便表示抱歉!!
本站所分享的影音作品均转自网络,仅供测试和学习交流。请在下载后24小时内删除,请购买/支持正版。
若有侵权,请留言告知,万分感谢!

发表评论


表情

评论列表

  1. boke112导航
    boke112导航  @回复

    必要的点缀还是有必要的,偶尔加上背景图还是不错的

  2. 区块链
    区块链  @回复

    face_03 然而还是么有添加的本事。哈哈哈