请问有没有方法把src路径写在css样式中呢？ 并且在div中只写<div id="img1"></div> 不写<img/> 属性了。
当我这样写的时候#img1{width:245px;height:160px;background-repeat:no-repeat;background:url(../...
当我这样写的时候
#img1{
width:245px;
height:160px;
background-repeat:no-repeat;
background:url(../images/71.jpg);
}
<div id="img1"></div>
由于图片太大，只能显示一小部分，但是我想显示全部图片（类似于用工具把图片缩小）
比如：图片原来是400*200 显示在页面上时245*160的，但是还是能完整的看清图片
怎么做呢？
谢谢。
我的意思是把路径写到css样式中，div中就不写img了也就是 div中只有id或者class
就像<div id=" "></div> 而不是把img写在div中间呢 .
谢谢各位。难道我的想法真的是错的。不能那样实现吗。
...... 展开
#img1{
width:245px;
height:160px;
background-repeat:no-repeat;
background:url(../images/71.jpg);
}
<div id="img1"></div>
由于图片太大，只能显示一小部分，但是我想显示全部图片（类似于用工具把图片缩小）
比如：图片原来是400*200 显示在页面上时245*160的，但是还是能完整的看清图片
怎么做呢？
谢谢。
我的意思是把路径写到css样式中，div中就不写img了也就是 div中只有id或者class
就像<div id=" "></div> 而不是把img写在div中间呢 .
谢谢各位。难道我的想法真的是错的。不能那样实现吗。
...... 展开
4个回答
展开全部
下面是我的代码，div里面没有img标签，div有背景图，显示效果是背景图随着div的大小改变而改变，不知道你是不是要这种效果。找个图片试一下吧。把src写到css里不大可能...
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
<style type="text/css">
#div{ width:100px; height:200px; background:url(images/red_380_104.jpg) no-repeat -1000px -1000px;}
</style>
</head>
<body>
<div id="div"></div>
<script type="text/javascript">
var _div=document.getElementById('div');
var divStyle=document.defaultView?document.defaultView.getComputedStyle(_div,null):_div.currentStyle;
var sImgurl=(/images.+\"/.exec(divStyle.backgroundImage))[0].split('"')[0];
var oImage=document.createElement("img");
oImage.src=sImgurl;
oImage.width=(divStyle.width).split("px")[0];
oImage.height=(divStyle.height).split("px")[0];
_div.appendChild(oImage);
</script>
</body>
</html>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
<style type="text/css">
#div{ width:100px; height:200px; background:url(images/red_380_104.jpg) no-repeat -1000px -1000px;}
</style>
</head>
<body>
<div id="div"></div>
<script type="text/javascript">
var _div=document.getElementById('div');
var divStyle=document.defaultView?document.defaultView.getComputedStyle(_div,null):_div.currentStyle;
var sImgurl=(/images.+\"/.exec(divStyle.backgroundImage))[0].split('"')[0];
var oImage=document.createElement("img");
oImage.src=sImgurl;
oImage.width=(divStyle.width).split("px")[0];
oImage.height=(divStyle.height).split("px")[0];
_div.appendChild(oImage);
</script>
</body>
</html>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
你可以这样做： <div id="dd"><img src=""/></div>
#dd{
width:245px;
height:160px;
}
#dd img{
width:245px;
height:160px;}
#dd{
width:245px;
height:160px;
}
#dd img{
width:245px;
height:160px;}
本回答被提问者和网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
function DrawImage(ImgD,FitWidth,FitHeight){
var image=new Image();
image.src=ImgD.src;
if(image.width>0 && image.height>0){
if(image.width/image.height>= FitWidth/FitHeight){
if(image.width>FitWidth){
ImgD.width=FitWidth;
ImgD.height=(image.height*FitWidth)/image.width;
}else{
ImgD.width=image.width;
ImgD.height=image.height;
}
} else{
if(image.height>FitHeight){
ImgD.height=FitHeight;
ImgD.width=(image.width*FitHeight)/image.height;
}else{
ImgD.width=image.width;
ImgD.height=image.height;
}
}
}
}
用法：
<img class="ImgClass" onload="DrawImage(this,'143','106')" alt="" src='' />
var image=new Image();
image.src=ImgD.src;
if(image.width>0 && image.height>0){
if(image.width/image.height>= FitWidth/FitHeight){
if(image.width>FitWidth){
ImgD.width=FitWidth;
ImgD.height=(image.height*FitWidth)/image.width;
}else{
ImgD.width=image.width;
ImgD.height=image.height;
}
} else{
if(image.height>FitHeight){
ImgD.height=FitHeight;
ImgD.width=(image.width*FitHeight)/image.height;
}else{
ImgD.width=image.width;
ImgD.height=image.height;
}
}
}
}
用法：
<img class="ImgClass" onload="DrawImage(this,'143','106')" alt="" src='' />
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
很遗憾，CSS规则中没有指定background-image大小的属性。
并且把图片放在CSS背景中搜索引擎是无法索引的。
最好的方法是
把zengzhizzz提供的javascript代码（这是一段很有名气的按图片比例缩放的代码）放在网页的<head></head>中
并且把图片放在CSS背景中搜索引擎是无法索引的。
最好的方法是
把zengzhizzz提供的javascript代码（这是一段很有名气的按图片比例缩放的代码）放在网页的<head></head>中
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（2）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
