简要咨询咨询QQ网站导航网站搜索手机站点联系我们设为首页加入收藏 

页面背景图片的拉伸实现代码

来源:易贤网   阅读:1049 次  日期:2015-03-02 11:01:33

温馨提示:易贤网小编为您整理了“页面背景图片的拉伸实现代码”,方便广大网友查阅!

代码如下:

<span style="font-family: Arial, Helvetica, sans-serif; background-color: rgb(255, 255, 255);"><strong><span style="font-size:12px;color:#3333ff;">1.用js插入一张图片并控制图片宽高</span></strong></span>

代码如下:

<script type="text/javascript" src="jquery-1.4.2.min.js"></script>

<script type="text/javascript">

$(function(){

$(".bd").append("<div id='mainbg'/>");

$("#mainbg").append("<img id='im' src='a82a2e72e7af59296db0d63e3d2ecc5e!n1200.jpg' />");

recover();

$(window).resize(function(e) {

recover();

});

});

function recover(){

var winw = $(window).width();

var winh = $(window).height();

$("#im").attr({width:winw, height:winh});

}

</script>

利用CSS按比例缩放背景图片

代码如下:

<style type="text/css">

.bd{

background-image:url(a82a2e72e7af59296db0d63e3d2ecc5e!n1200.jpg);

background-repeat:no-repeat;

background-size:cover;

}

</style>

<body class="bd">

</body>

更多信息请查看IT技术专栏

更多信息请查看脚本栏目
点此处就本文及相关问题在本站进行非正式的简要咨询(便捷快速)】     【点此处查询各地各类考试咨询QQ号码及交流群
上一篇:严格来说不是光CSS就能令IE浏览器崩溃(crash)
下一篇:hideFocus(虚线框处理小技巧)
易贤网手机网站地址:页面背景图片的拉伸实现代码
由于各方面情况的不断调整与变化,易贤网提供的所有考试信息和咨询回复仅供参考,敬请考生以权威部门公布的正式信息和咨询为准!